*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f1117;--bg-surface:#1a1d27;--bg-hover:#252836;--border:#2e3140;--text:#e4e6ef;--text-muted:#8b8fa3;--primary:#6366f1;--primary-hover:#818cf8;--danger:#ef4444;--danger-hover:#f87171;--success:#22c55e;--warning:#eab308;--radius:8px;--radius-lg:12px}html{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.loading{flex-direction:column;justify-content:center;align-items:center;gap:1rem;height:100vh;display:flex}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.navbar{background:var(--bg-surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.75rem 1.5rem;display:flex}.nav-left{align-items:center;gap:.5rem;display:flex}.nav-right{align-items:center;gap:1rem;display:flex}.nav-brand{color:var(--primary);cursor:pointer;background:0 0;border:none;padding:.25rem .5rem;font-size:1.25rem;font-weight:700}.nav-link{color:var(--text-muted);cursor:pointer;border-radius:var(--radius);background:0 0;border:none;padding:.25rem .75rem;font-size:.9rem;transition:all .15s}.nav-link:hover,.nav-link.active{color:var(--text);background:var(--bg-hover)}.user-name{color:var(--text-muted);font-size:.9rem}.container{max-width:960px;margin:0 auto;padding:1.5rem}.btn{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-surface);color:var(--text);cursor:pointer;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.9rem;transition:all .15s;display:inline-flex}.btn:hover{background:var(--bg-hover)}.btn-sm{padding:.25rem .5rem;font-size:.8rem}.btn-primary{background:var(--primary);border-color:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn-danger:hover{background:var(--danger-hover)}.btn-warning{background:var(--warning);border-color:var(--warning);color:#000}.btn-warning:hover{background:#ca8a04}.btn-group{gap:.5rem;display:flex}input[type=email],input[type=date],input[type=text],textarea{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);width:100%;padding:.5rem .75rem;font-size:.9rem}textarea{resize:vertical}.error{border:1px solid var(--danger);border-radius:var(--radius);color:var(--danger);background:#ef44441a;margin-bottom:1rem;padding:.75rem 1rem}.login-page{justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);text-align:center;min-width:360px;padding:3rem}.login-logo{color:var(--primary);margin-bottom:.5rem}.login-card h1{color:var(--primary);margin-bottom:.25rem;font-size:2.5rem;font-weight:800}.subtitle{color:var(--text-muted);margin-bottom:2rem}.login-buttons{flex-direction:column;gap:.75rem;display:flex}.btn-oauth{border-radius:var(--radius);justify-content:center;align-items:center;gap:.75rem;padding:.75rem 1.5rem;font-size:1rem;font-weight:500;text-decoration:none;transition:all .15s;display:flex}.btn-google{color:#333;background:#fff;border:1px solid #ddd}.btn-google:hover{background:#f5f5f5}.btn-github{color:#fff;background:#24292e;border:1px solid #444}.btn-github:hover{background:#2f363d}.hidden-input{display:none}.calendar-page{max-width:800px;margin:0 auto}.calendar-header{align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.calendar-header h2{text-align:center;min-width:200px}.create-form{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);flex-wrap:wrap;gap:.75rem;margin-bottom:1.5rem;padding:1rem;display:flex}.create-form input{flex:1;min-width:150px}.calendar-grid{grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.weekday-header{text-align:center;color:var(--text-muted);padding:.5rem;font-size:.8rem;font-weight:600}.calendar-cell{aspect-ratio:1;background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);cursor:default;flex-direction:column;justify-content:flex-start;align-items:center;padding:.5rem;font-size:.9rem;display:flex}.calendar-cell.empty{background:0 0;border-color:#0000}.calendar-cell.clickable{cursor:pointer}.calendar-cell.clickable:hover{background:var(--bg-hover);border-color:var(--border)}.calendar-cell.has-jumpday{border-color:var(--primary);background:#6366f114;font-weight:600}.calendar-cell.has-jumpday:hover{border-color:var(--primary-hover);background:#6366f126}.calendar-cell.canceled{opacity:.6;border-color:var(--text-muted);border-style:dashed;text-decoration:line-through}.calendar-cell.canceled .status-bar{background:var(--text-muted)}.calendar-cell.today{border-color:var(--primary)}.day-number{font-size:.85rem}.jumpday-indicator{width:100%;margin-top:auto}.status-bar{border-radius:2px;width:100%;height:3px;display:block}.status-full .status-bar{background:var(--success)}.status-partial .status-bar{background:var(--warning)}.status-empty .status-bar{background:var(--danger)}.modal-backdrop{z-index:100;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);width:90%;max-width:500px;max-height:85vh;overflow-y:auto}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex}.modal-body{padding:1.5rem}.section{margin-bottom:1.5rem}.section h4{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;font-size:.8rem}.notes-text{color:var(--text-muted);font-size:.9rem}.notes-edit{flex-direction:column;gap:.5rem;display:flex}.assignment{background:var(--bg);border-radius:var(--radius);justify-content:space-between;align-items:center;padding:.5rem;display:flex}.assigned-user{align-items:center;gap:.5rem;display:flex}.avatar{border-radius:50%;width:24px;height:24px}.cancel-reason-banner{color:var(--danger);border-bottom:1px solid var(--border);background:#ef44441a;padding:.5rem 1.5rem;font-size:.9rem}.cancel-form{flex-direction:column;gap:.5rem;display:flex}.canceled-badge{text-transform:uppercase;color:var(--danger);background:#ef444426;border-radius:4px;margin-left:.5rem;padding:.125rem .5rem;font-size:.7rem;font-weight:600}.req-badge{text-transform:uppercase;letter-spacing:.03em;vertical-align:middle;border-radius:4px;margin-left:.5rem;padding:.1rem .4rem;font-size:.65rem;font-weight:500}.req-required{color:var(--danger);background:#ef444426}.req-limiting{color:var(--warning);background:#eab30826}.unassigned{color:var(--text-muted);margin-bottom:.5rem;font-size:.9rem;font-style:italic}.danger-zone{border-top:1px solid var(--border);padding-top:1rem}.admin-page h2{margin-bottom:1.5rem}.admin-page table{table-layout:fixed}.col-name{width:180px}.col-email{width:220px}.col-actions{width:80px}.modal-actions{justify-content:flex-end;gap:.5rem;margin-top:1rem;display:flex}.delete-preview-list{max-height:200px;margin:.5rem 0;padding-left:1.25rem;font-size:.9rem;overflow-y:auto}.table-wrapper{overflow-x:auto}table{border-collapse:collapse;width:100%}th,td{text-align:left;border-bottom:1px solid var(--border);padding:.75rem 1rem}th{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:600}.roles-cell{align-items:center;gap:.5rem;display:flex}.pills{flex-wrap:wrap;gap:.35rem;display:flex}.pill{background:var(--bg-hover);border:1px solid var(--border);white-space:nowrap;border-radius:999px;align-items:center;gap:.25rem;padding:.15rem .5rem;font-size:.8rem;display:inline-flex}.pill-x{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 .15rem;font-size:.75rem;line-height:1}.pill-x:hover{color:var(--danger)}.add-role-btn{padding:.1rem .5rem;font-size:.85rem;line-height:1.2}.role-dropdown{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius);z-index:50;min-width:140px;position:fixed;overflow:hidden;box-shadow:0 4px 12px #0000004d}.role-dropdown-item{width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:none;padding:.4rem .75rem;font-size:.85rem;display:block}.role-dropdown-item:hover{background:var(--bg-hover)}.role-col{text-align:center;width:80px}.user-cell{align-items:center;gap:.5rem;display:flex}.checkbox-label{justify-content:center;align-items:center;display:flex}input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary);cursor:pointer}.magic-link-form{flex-direction:column;gap:.75rem;margin-bottom:0;display:flex}.magic-link-sent{text-align:center}.magic-link-sent p:first-child{margin-bottom:.5rem;font-size:1.25rem;font-weight:600}.sent-detail{color:var(--text-muted);margin-bottom:1.5rem;font-size:.9rem}.divider{color:var(--text-muted);align-items:center;gap:1rem;margin:1.25rem 0;font-size:.8rem;display:flex}.divider:before,.divider:after{content:"";border-top:1px solid var(--border);flex:1}.btn-passkey{background:var(--bg-hover);color:var(--text);border:1px solid var(--border);width:100%}.btn-passkey:hover{background:var(--bg-surface);border-color:var(--primary)}.account-page h2{margin-bottom:1.5rem}.account-section{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--radius-lg);margin-bottom:1.5rem;padding:1.5rem}.account-section h3{margin-bottom:.25rem;font-size:1.1rem}.section-desc{color:var(--text-muted);margin-bottom:1rem;font-size:.875rem}.profile-info{flex-direction:column;gap:.5rem;display:flex}.profile-row{align-items:center;gap:1rem;display:flex}.profile-row .label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;min-width:60px;font-size:.8rem}.btn-icon{cursor:pointer;color:var(--text-muted);border-radius:var(--radius);background:0 0;border:none;padding:.125rem .375rem;font-size:1rem}.btn-icon:hover{color:var(--text);background:var(--bg-hover)}.name-input{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg);color:var(--text);padding:.25rem .5rem;font-size:.95rem}.provider-badge{background:var(--bg-hover);border-radius:var(--radius);text-transform:capitalize;padding:.125rem .5rem;font-size:.85rem;display:inline-block}.passkey-list{flex-direction:column;gap:.5rem;display:flex}.passkey-item{background:var(--bg);border-radius:var(--radius);justify-content:space-between;align-items:center;padding:.75rem;display:flex}.passkey-info{flex-direction:column;gap:.125rem;display:flex}.passkey-name{font-weight:500}.passkey-date{color:var(--text-muted);font-size:.8rem}.text-muted{color:var(--text-muted);font-size:.9rem}.success{border:1px solid var(--success);border-radius:var(--radius);color:var(--success);background:#22c55e1a;margin-bottom:1rem;padding:.75rem 1rem}.inline-input,.inline-select{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);width:100%;padding:.25rem .5rem;font-size:.85rem}.num-col{text-align:center;width:90px}.num-input{text-align:center;width:70px}.toast-container{z-index:200;flex-direction:column;gap:.5rem;max-width:400px;display:flex;position:fixed;top:1rem;right:1rem}.toast{border-radius:var(--radius);justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.9rem;animation:.2s ease-out toast-in;display:flex;box-shadow:0 4px 12px #0000004d}@keyframes toast-in{0%{opacity:0;transform:translate(1rem)}to{opacity:1;transform:translate(0)}}.toast-success{background:var(--bg-surface);border:1px solid var(--success);color:var(--success)}.toast-error{background:var(--bg-surface);border:1px solid var(--danger);color:var(--danger)}.toast-warning{background:var(--bg-surface);border:1px solid var(--warning);color:var(--warning)}.toast-message{flex:1}.toast-close{color:inherit;cursor:pointer;opacity:.6;background:0 0;border:none;padding:0 .25rem;font-size:.85rem}.toast-close:hover{opacity:1}@media (width<=640px){.calendar-header{flex-wrap:wrap}.calendar-cell{padding:.25rem;font-size:.8rem}.navbar{padding:.5rem 1rem}.container{padding:1rem}.login-card{min-width:auto;margin:1rem;padding:2rem}}
