@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--color-primary:#7c5a3e;--color-primary-light:#9b7a5e;--color-primary-dark:#5c3e28;--color-complement:#3e607c;--color-complement-light:#5a7e9b;--color-bg:#faf6f1;--color-bg-warm:#f5ede3;--color-card:#fff;--color-text:#2c1e10;--color-text-muted:#7a6b5d;--color-border:#e8ddd0;--color-border-light:#f0e8dd;--color-success:#4a7c3e;--color-success-light:#e8f3e5;--color-success-bg:#dcefd7;--color-danger:#a65d4e;--color-danger-light:#f5e8e5;--color-danger-bg:#f0d8d2;--color-warning:#b8860b;--color-warning-light:#fdf3dc;--color-gray:#9a8d80;--color-gray-light:#c8bfb4;--shadow-sm:0 1px 2px #2c1e100f;--shadow-md:0 2px 8px #2c1e1014, 0 1px 3px #2c1e100f;--shadow-lg:0 4px 16px #2c1e101a, 0 2px 6px #2c1e100f;--shadow-xl:0 8px 32px #2c1e101f, 0 4px 12px #2c1e1014;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;font-size:16px}body{font-family:var(--font-family);background-color:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100dvh;line-height:1.6}img,svg{max-width:100%;display:block}button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}button{cursor:pointer}a{color:var(--color-complement);text-decoration:none}a:hover{text-decoration:underline}h1{letter-spacing:-.02em;font-size:1.75rem;font-weight:700;line-height:1.2}h2{letter-spacing:-.015em;font-size:1.375rem;font-weight:600;line-height:1.3}h3{font-size:1.125rem;font-weight:600;line-height:1.4}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-muted{color:var(--color-text-muted)}.text-center{text-align:center}#app{width:100%;min-height:100dvh}.container{width:100%;max-width:600px;margin:0 auto;padding:0 16px}.container--wide{max-width:960px}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.py-1{padding-top:8px;padding-bottom:8px}.py-2{padding-top:16px;padding-bottom:16px}.gap-1{gap:8px}.gap-2{gap:16px}.login-page{background-color:var(--color-bg);justify-content:center;align-items:center;min-height:100dvh;padding:24px 16px;display:flex}.login-card{background:var(--color-card);border-radius:var(--radius-lg);width:100%;max-width:380px;box-shadow:var(--shadow-lg);border:1px solid var(--color-border-light);animation:fadeIn var(--transition-slow) ease;padding:40px 32px}.login-icon{text-align:center;margin-bottom:8px;font-size:2.5rem}.login-title{text-align:center;color:var(--color-primary);margin-bottom:4px}.login-subtitle{text-align:center;color:var(--color-text-muted);margin-bottom:32px;font-size:.875rem}.login-form{flex-direction:column;gap:16px;display:flex}.login-input{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);width:100%;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:14px 16px;font-size:1rem}.login-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #7c5a3e1f}.login-input::placeholder{color:var(--color-gray-light)}.btn{border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast);-webkit-user-select:none;user-select:none;border:none;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:12px 20px;font-size:.9375rem;font-weight:600;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover{background-color:var(--color-primary-dark);box-shadow:var(--shadow-md)}.btn-secondary{background-color:var(--color-bg-warm);color:var(--color-text);border:1px solid var(--color-border)}.btn-secondary:hover{background-color:var(--color-border-light)}.btn-complement{background-color:var(--color-complement);color:#fff}.btn-complement:hover{box-shadow:var(--shadow-md);background-color:#335068}.btn-danger{background-color:var(--color-danger);color:#fff}.btn-danger:hover{background-color:#8f4f42}.btn-ghost{color:var(--color-text-muted);background:0 0;min-height:40px;padding:8px 12px}.btn-ghost:hover{background-color:var(--color-bg-warm);color:var(--color-text)}.btn-icon{width:40px;height:40px;color:var(--color-text-muted);cursor:pointer;transition:background-color var(--transition-fast), color var(--transition-fast);min-height:unset;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:1.25rem;display:inline-flex}.btn-icon:hover{background-color:var(--color-danger-light);color:var(--color-danger)}.btn-back{color:var(--color-text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;align-items:center;gap:4px;padding:8px 0;font-size:.9375rem;font-weight:500;display:inline-flex}.btn-back:hover{color:var(--color-text)}.btn-block{width:100%}.btn-add{border:2px dashed var(--color-border);border-radius:var(--radius-md);width:100%;color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;justify-content:center;align-items:center;gap:8px;min-height:48px;padding:14px;font-size:.9375rem;font-weight:500;display:flex}.btn-add:hover{border-color:var(--color-primary);color:var(--color-primary);background-color:#7c5a3e0a}.page-header{justify-content:space-between;align-items:center;gap:12px;padding:16px 0;display:flex}.page-header h1{flex:1}.overview-link{background-color:var(--color-complement);color:#fff;border-radius:var(--radius-sm);transition:background-color var(--transition-fast), box-shadow var(--transition-fast);white-space:nowrap;align-items:center;gap:6px;padding:10px 16px;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex}.overview-link:hover{box-shadow:var(--shadow-md);background-color:#335068;text-decoration:none}.group-grid{grid-template-columns:repeat(2,1fr);gap:12px;padding-bottom:32px;display:grid}.group-card{background:var(--color-card);border:1px solid var(--color-border-light);border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-fast), border-color var(--transition-fast);box-shadow:var(--shadow-sm);-webkit-user-select:none;user-select:none;flex-direction:column;gap:8px;padding:20px 16px;display:flex}.group-card:hover{box-shadow:var(--shadow-md);border-color:var(--color-primary-light);transform:translateY(-2px)}.group-card:active{transform:scale(.98)}.group-card__name{color:var(--color-text);font-size:1rem;font-weight:600}.group-card__stats{color:var(--color-text-muted);font-size:.8125rem;font-weight:500}.group-card__indicator{background-color:var(--color-border-light);border-radius:2px;width:100%;height:4px;margin-top:4px;overflow:hidden}.group-card__indicator-fill{height:100%;transition:width var(--transition-base);border-radius:2px}.indicator--high{background-color:var(--color-success)}.indicator--mid{background-color:var(--color-warning)}.indicator--low{background-color:var(--color-danger)}.indicator--empty{background-color:var(--color-gray-light)}.group-page{padding-bottom:32px}.group-header{padding:12px 0 8px}.summary-bar{background:var(--color-card);border:1px solid var(--color-border-light);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);justify-content:space-between;align-items:center;margin-bottom:16px;padding:14px 18px;display:flex}.summary-bar__text{color:var(--color-text);font-size:.9375rem;font-weight:600}.summary-bar__badge{border-radius:100px;align-items:center;gap:6px;padding:4px 12px;font-size:.8125rem;font-weight:600;display:inline-flex}.badge--positive{background-color:var(--color-success-light);color:var(--color-success)}.badge--warning{background-color:var(--color-warning-light);color:var(--color-warning)}.badge--negative{background-color:var(--color-danger-light);color:var(--color-danger)}.student-list{flex-direction:column;gap:2px;margin-bottom:16px;display:flex}.student-item{background:var(--color-card);border-radius:var(--radius-sm);border:1px solid var(--color-border-light);transition:background-color var(--transition-fast);animation:slideUp var(--transition-base) ease;align-items:center;gap:12px;padding:14px 16px;display:flex}.student-item:hover{background-color:var(--color-bg-warm)}.student-item.is-present{border-left:3px solid var(--color-success)}.student-item.is-absent{border-left:3px solid var(--color-border)}.student-item__name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:.9375rem;font-weight:500;overflow:hidden}.student-item__status{white-space:nowrap;font-size:.75rem;font-weight:500}.status--present{color:var(--color-success)}.status--absent{color:var(--color-gray)}.student-delete{width:36px;height:36px;color:var(--color-gray-light);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:1.125rem;display:flex}.student-delete:hover{background-color:var(--color-danger-light);color:var(--color-danger)}.toggle-switch{flex-shrink:0;width:58px;height:32px;display:inline-block;position:relative}.toggle-switch input{opacity:0;width:0;height:0;position:absolute}.toggle-switch__slider{background-color:var(--color-gray-light);cursor:pointer;transition:background-color var(--transition-fast);border-radius:32px;position:absolute;inset:0}.toggle-switch__slider:before{content:"";width:26px;height:26px;transition:transform var(--transition-fast);background-color:#fff;border-radius:50%;position:absolute;bottom:3px;left:3px;box-shadow:0 1px 3px #00000026}.toggle-switch input:checked+.toggle-switch__slider{background-color:var(--color-success)}.toggle-switch input:checked+.toggle-switch__slider:before{transform:translate(26px)}.toggle-switch input:focus-visible+.toggle-switch__slider{outline:2px solid var(--color-complement);outline-offset:2px}.empty-state{text-align:center;color:var(--color-text-muted);padding:48px 24px}.empty-state__icon{margin-bottom:12px;font-size:2.5rem}.empty-state__text{font-size:.9375rem;line-height:1.5}.overview-page{padding-bottom:32px}.overview-total{text-align:center;background:var(--color-card);border-radius:var(--radius-md);border:1px solid var(--color-border-light);box-shadow:var(--shadow-sm);margin-bottom:20px;padding:20px}.overview-total__number{color:var(--color-primary);font-size:2rem;font-weight:700;line-height:1.2}.overview-total__label{color:var(--color-text-muted);margin-top:2px;font-size:.875rem;font-weight:500}.overview-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.overview-card{background:var(--color-card);border:1px solid var(--color-border-light);border-radius:var(--radius-md);cursor:pointer;transition:transform var(--transition-fast), box-shadow var(--transition-fast);box-shadow:var(--shadow-sm);-webkit-user-select:none;user-select:none;padding:16px 14px}.overview-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.overview-card:active{transform:scale(.98)}.overview-card__header{justify-content:space-between;align-items:baseline;margin-bottom:10px;display:flex}.overview-card__name{color:var(--color-text);font-size:.8125rem;font-weight:600}.overview-card__count{color:var(--color-text-muted);font-size:.8125rem;font-weight:600}.progress-bar{background-color:var(--color-border-light);border-radius:3px;width:100%;height:6px;overflow:hidden}.progress-fill{height:100%;transition:width var(--transition-base);border-radius:3px;min-width:0}.progress--high{background-color:var(--color-success)}.progress--mid{background-color:var(--color-warning)}.progress--low{background-color:var(--color-danger)}.progress--empty{background-color:var(--color-gray-light)}dialog{border-radius:var(--radius-lg);width:100%;max-width:min(90vw,400px);box-shadow:var(--shadow-xl);background:var(--color-card);animation:slideUp var(--transition-base) ease;border:none;padding:0}dialog::backdrop{-webkit-backdrop-filter:blur(4px);background:#2c1e1066}.modal-content{padding:28px 24px}.modal-content h2{color:var(--color-primary);margin-bottom:20px}.modal-input{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);width:100%;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:12px 14px;font-size:1rem}.modal-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px #7c5a3e1f}.modal-actions{gap:10px;margin-top:20px;display:flex}.modal-actions .btn{flex:1}.confirm-text{color:var(--color-text);margin-bottom:4px;font-size:.9375rem;line-height:1.5}#toast-container{z-index:10000;pointer-events:none;flex-direction:column;gap:8px;width:max-content;max-width:calc(100vw - 32px);display:flex;position:fixed;top:16px;left:50%;transform:translate(-50%)}.toast{border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);animation:toastIn var(--transition-base) ease;pointer-events:auto;padding:12px 20px;font-size:.875rem;font-weight:500}.toast-success{background-color:var(--color-success);color:#fff}.toast-error{background-color:var(--color-danger);color:#fff}.toast-info{background-color:var(--color-complement);color:#fff}.toast--leaving{animation:toastOut var(--transition-fast) ease forwards}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes toastIn{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes toastOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-12px)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-6px)}80%{transform:translate(6px)}}.shake{animation:.4s shake}.fade-in{animation:fadeIn var(--transition-base) ease}.loading{color:var(--color-text-muted);justify-content:center;align-items:center;gap:10px;padding:48px;font-size:.875rem;display:flex}.spinner{border:2px solid var(--color-border);border-top-color:var(--color-primary);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (width>=640px){.group-grid{grid-template-columns:repeat(3,1fr);gap:14px}.overview-grid{grid-template-columns:repeat(3,1fr);gap:12px}.container{padding:0 24px}.login-card{padding:48px 40px}h1{font-size:2rem}}@media (width>=1024px){.group-grid{grid-template-columns:repeat(4,1fr);gap:16px}.overview-grid{grid-template-columns:repeat(4,1fr);gap:14px}.container--wide{max-width:1080px}}