.attendance-container{max-width:850px;min-height:80vh;margin:0 auto;padding:1rem}.attendance-container .page-header{text-align:center;margin-bottom:.75rem}.attendance-container .glitch-text{background:var(--accent-gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:clamp(1.6rem,4vw,2.2rem);font-weight:900;line-height:1.1}.attendance-container .subtitle{color:var(--text-secondary);margin-top:.25rem;font-size:.85rem}.attendance-container .glass-card{background:var(--bg-card);border:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:12px;padding:.75rem}.attendance-container .overview-section{margin-bottom:1rem}.attendance-container .total-stats{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;padding:.75rem;display:flex}.attendance-container .stat-circle{justify-content:center;align-items:center;width:80px;height:80px;display:flex;position:relative}.attendance-container .progress-ring{width:80px;height:80px;position:absolute;top:0;left:0;transform:rotate(-90deg)}.attendance-container .ring-bg{fill:#0000;stroke:#94a3b81a;stroke-width:5px;cx:40;cy:40;r:36}.attendance-container .ring-progress{fill:#0000;stroke:var(--accent-blue);stroke-width:5px;cx:40;cy:40;r:36;stroke-dasharray:226.19;stroke-dashoffset:226.19px;stroke-linecap:round;transition:stroke-dashoffset .5s ease-out,stroke .3s}.attendance-container .stat-value{color:#fff;z-index:1;font-size:1.25rem;font-weight:900}.attendance-container .stat-info h2{color:#fff;margin:0 0 .15rem;font-size:1.15rem}.attendance-container .stat-info p{color:var(--text-secondary);margin:0;font-size:.85rem}.attendance-container .status-msg{font-size:.9rem;font-weight:700;margin-top:.15rem!important}.attendance-container .status-safe{color:#10b981}.attendance-container .status-danger{color:#ef4444}.attendance-container .controls-section{flex-flow:column;gap:.5rem;margin-bottom:.75rem;display:flex}.attendance-container .add-subject-form{background:#3b82f614;border:1px solid #3b82f666;border-radius:12px;align-items:stretch;gap:.5rem;padding:.4rem;display:flex}.attendance-container .add-subject-form input{background:var(--bg-primary);color:#fff;border:2px solid #3b82f680;border-radius:8px;flex:auto;width:100%;min-width:0;margin:0;padding:.6rem 1rem;font-size:1rem;transition:color .3s,background-color .3s,border-color .3s,transform .3s;box-shadow:inset 0 2px 4px #0003}.attendance-container .add-subject-form input:focus{border-color:var(--accent-blue);outline:none;box-shadow:0 0 0 3px #3b82f666,inset 0 2px 4px #0000001a}.attendance-container .add-subject-form button{white-space:nowrap;border-radius:8px;flex:none;justify-content:center;align-items:center;padding:.6rem 1rem;font-size:1.25rem;line-height:1;display:flex}.attendance-container .btn-primary,.attendance-container .btn-secondary{cursor:pointer;border:none;margin:0;padding:.6rem 1rem;font-size:.95rem;font-weight:700;transition:color .3s,background-color .3s,border-color .3s,transform .3s}.attendance-container .btn-primary{background:var(--accent-gradient);color:#fff;border-radius:8px}.attendance-container .btn-primary:hover{opacity:.9;transform:translateY(-2px)}.attendance-container .btn-secondary{color:#ef4444;background:#ef44441a;border:1px solid #ef444433;border-radius:8px}.attendance-container .btn-secondary:hover{background:#ef444433}.attendance-container .subjects-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:.75rem;display:grid}.attendance-container .empty-state{text-align:center;color:var(--text-muted);border:1px dashed var(--border-subtle);background:#0f172a4d;border-radius:12px;grid-column:1/-1;padding:1.5rem;font-weight:600}.attendance-container .subject-header{justify-content:space-between;align-items:center;margin-bottom:.5rem;display:flex}.attendance-container .subject-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:1.15rem;overflow:hidden}.attendance-container .icon-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.1rem;transition:color .2s}.attendance-container .icon-btn:hover{color:#ef4444}.attendance-container .subject-stats{text-align:center;margin-bottom:.75rem}.attendance-container .stat-main{justify-content:center;align-items:baseline;gap:.5rem;margin-bottom:.15rem;display:flex}.attendance-container .stat-percent{font-size:1.75rem;font-weight:900;line-height:1}.attendance-container .stat-fraction{color:var(--text-secondary);font-size:1rem;font-weight:600}.attendance-container .text-safe{color:#10b981}.attendance-container .text-danger{color:#ef4444}.attendance-container .subject-msg{margin:0;font-size:.8rem;font-weight:600}.attendance-container .subject-actions{gap:.5rem;display:flex}.attendance-container .action-btn{cursor:pointer;border:none;border-radius:8px;flex:1;padding:.5rem;font-size:.85rem;font-weight:700;transition:background .2s}.attendance-container .btn-present{color:#10b981;background:#10b98126}.attendance-container .btn-present:hover{background:#10b98140}.attendance-container .btn-absent{color:#ef4444;background:#ef444426}.attendance-container .btn-absent:hover{background:#ef444440}.attendance-container .subject-header-actions{gap:.5rem;display:flex}.attendance-container .stat-fraction.clickable{cursor:pointer;-webkit-text-decoration:underline #0000;text-decoration:underline #0000;transition:color .2s}.attendance-container .stat-fraction.clickable:hover{color:var(--text-primary);-webkit-text-decoration-color:var(--text-muted);text-decoration-color:var(--text-muted)}.attendance-container .btn-undo{color:var(--text-muted);background:#94a3b826;flex:0 0 2rem;justify-content:center;align-items:center;font-size:1.1rem;display:flex}.attendance-container .btn-undo:hover:not(:disabled){color:#fff;background:#94a3b84d}.attendance-container .btn-undo:disabled{opacity:.3;cursor:not-allowed}.attendance-container-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;opacity:0;background:#00000080;justify-content:center;align-items:center;transition:opacity .3s;display:flex;position:fixed;inset:0}.attendance-container-modal-overlay.hidden{display:none}.attendance-container-modal-overlay.visible{opacity:1}.attendance-container-modal-overlay .modal-content{width:100%;max-width:400px;margin:1rem;transition:transform .3s;transform:translateY(20px)}.attendance-container-modal-overlay.visible .modal-content{transform:translateY(0)}.attendance-container-modal-overlay .modal-header{justify-content:space-between;align-items:center;margin-bottom:1.5rem;display:flex}.attendance-container-modal-overlay .modal-header h2{margin:0;font-size:1.25rem}.attendance-container-modal-overlay .modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;font-size:1.5rem;line-height:1}.attendance-container-modal-overlay .modal-close:hover{color:#fff}.attendance-container-modal-overlay .form-group{margin-bottom:1rem}.attendance-container-modal-overlay .form-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.attendance-container-modal-overlay .form-group label{color:var(--text-secondary);margin-bottom:.5rem;font-size:.85rem;font-weight:600;display:block}.attendance-container-modal-overlay .form-group input{border:1px solid var(--border-subtle);color:#fff;background:#0f172a66;border-radius:8px;width:100%;padding:.75rem;font-size:1rem}.attendance-container-modal-overlay .form-group input:focus{border-color:var(--accent-blue);outline:none}.attendance-container-modal-overlay .modal-actions{justify-content:flex-end;gap:1rem;margin-top:2rem;display:flex}.attendance-container-toast-container{z-index:2000;flex-direction:column;gap:.5rem;display:flex;position:fixed;bottom:2rem;right:2rem}.attendance-container-toast-container .toast{background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:12px;align-items:center;gap:1rem;padding:1rem 1.25rem;transition:transform .3s cubic-bezier(.175,.885,.32,1.275);display:flex;transform:translate(120%);box-shadow:0 10px 25px #00000080}.attendance-container-toast-container .toast.show{transform:translate(0)}.attendance-container-toast-container .toast-success{border-left:4px solid #10b981}.attendance-container-toast-container .toast-error{border-left:4px solid #ef4444}.attendance-container-toast-container .toast-info{border-left:4px solid var(--accent-blue)}.attendance-container-toast-container .toast-content{font-size:.9rem;font-weight:500}.attendance-container-toast-container .toast-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0;font-size:1.2rem;line-height:1}.attendance-container-toast-container .toast-close:hover{color:#fff}.attendance-container .settings-card{flex-direction:column;flex:1;justify-content:center;min-width:250px;padding:.75rem 1rem;display:flex}.attendance-container .settings-header h3{display:none}.attendance-container .settings-body{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.attendance-container .setting-item{align-items:center;gap:.5rem;display:flex}.attendance-container .setting-item label{color:var(--text-muted);font-size:.85rem;font-weight:600}.attendance-container .setting-item select{border:1px solid var(--border-subtle);color:#fff;text-align:center;cursor:pointer;background:#0f172a66;border-radius:8px;width:auto;min-width:60px;padding:.3rem;font-size:.85rem;font-weight:700}.attendance-container .setting-actions{gap:.5rem;display:flex}.attendance-container .btn-ghost{border:1px dashed var(--border-subtle);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:8px;justify-content:center;align-items:center;padding:.3rem .5rem;font-size:.85rem;font-weight:600;transition:transform .2s;display:flex}.attendance-container .btn-ghost:hover{color:#fff;border-color:var(--text-muted);background:#94a3b81a}.attendance-container .btn-danger{color:#ef4444;cursor:pointer;background:#ef44441a;border:1px solid #ef444433;border-radius:8px;padding:.3rem .6rem;font-size:.8rem;font-weight:600;transition:transform .2s}.attendance-container .btn-danger:hover{background:#ef444433}.attendance-container .file-upload-label{cursor:pointer;margin:0;display:inline-block}.attendance-container .hidden-file-input{display:none}@media (width<=600px){.attendance-container{padding:.5rem}.attendance-container .page-header{margin-bottom:.5rem}.attendance-container .add-subject-form{border-radius:12px;flex-direction:row;gap:.5rem;padding:.4rem}.attendance-container .add-subject-form input{width:100%;min-width:0;padding:.5rem;font-size:.95rem}.attendance-container .add-subject-form button{white-space:nowrap;width:auto;padding:.5rem 1rem;font-size:1.25rem}.attendance-container .controls-section{flex-direction:column;gap:.5rem;margin-bottom:.75rem}.attendance-container .settings-body{gap:.4rem}.attendance-container .btn-ghost,.attendance-container .btn-danger{padding:.3rem .4rem}.attendance-container-toast-container{bottom:1rem;left:1rem;right:1rem}.attendance-container-toast-container .toast{width:100%}}
