body{margin:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:#f4f6f8;color:#333;line-height:1.6}.home-container{text-align:center;padding:4rem 2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;background:linear-gradient(180deg,#fff,#f7f7fa)}.home-title{font-size:2.4rem;font-weight:700;color:#222;margin-bottom:.5rem}.home-subtitle{font-size:1.1rem;color:#555;margin-bottom:2.5rem}.home-buttons{display:flex;flex-direction:column;gap:1.5rem;width:100%;max-width:700px}.home-btn{display:flex;align-items:center;justify-content:center;gap:1rem;width:100%;background-color:#ffe873;color:#000;border:none;border-radius:12px;font-size:1.4rem;font-weight:600;padding:1.6rem 0;cursor:pointer;transition:all .2s ease;box-shadow:0 3px 8px #00000014}.home-btn:hover{background-color:#fff18f;transform:translateY(-2px);box-shadow:0 5px 12px #0000001a}.home-icon{flex-shrink:0}.rota-btn{background-color:#66b3ff;color:#fff}.rota-btn:hover{background-color:#5ca8f7}.record-btn{background-color:#ffe873;color:#000}.record-btn:hover{background-color:#fff18f}@media (max-width: 600px){.home-btn{font-size:1.1rem;padding:1.2rem 0}.home-title{font-size:1.9rem}}.sign-in-form{background:#fff;padding:2.5rem;border-radius:12px;box-shadow:0 5px 15px #0000001a;display:flex;flex-direction:column;gap:1.25rem;width:100%;max-width:400px;margin:2rem 0}.sign-in-form h2{text-align:center;margin-top:0;margin-bottom:.5rem;color:#333}.sign-in-form input[type=email],.sign-in-form input[type=password]{width:100%;padding:.8rem 1rem;font-size:1rem;border:1px solid #dcdcdc;border-radius:6px;box-sizing:border-box;transition:border-color .2s,box-shadow .2s}.sign-in-form input[type=email]:focus,.sign-in-form input[type=password]:focus{outline:none;border-color:#0073e6;box-shadow:0 0 0 3px #0073e626}.sign-in-form button{width:100%;padding:.8rem;font-size:1.1rem;font-weight:600;background-color:#f5c518;color:#fff;margin-top:.5rem}.sign-in-form button:hover{background-color:#f1d261}@media (max-width: 768px){.admin-footer{flex-direction:column;gap:1rem;align-items:stretch}.adminSection{width:100%;border-right:none;border-bottom:1px solid #e0e0e0;padding-bottom:1rem}}.modal-overlay{position:fixed;z-index:1000;left:0;top:0;width:100vw;height:100vh;background:#0000004d;display:flex;align-items:center;justify-content:center}.modal-content{background:#fff;border-radius:8px;padding:2rem;min-width:320px;box-shadow:0 4px 24px #00000026;position:relative}.modal-close{position:absolute;top:12px;right:12px;background:transparent;border:none;font-size:1.5rem;font-weight:700;color:#888;cursor:pointer;line-height:1}form,.request-change-form{display:flex;flex-direction:column;gap:1rem}.form-group{display:flex;flex-direction:column}.form-group label{font-weight:600;margin-bottom:.25rem}.form-group input,.form-group select{padding:.4rem .6rem;border:1px solid #ccc;border-radius:6px;font-size:.95rem}.checkbox-group{flex-direction:row;align-items:center}.checkbox-group label{font-weight:400}.submit-btn{padding:.6rem 1rem;background-color:#f5c518;border:none;border-radius:6px;cursor:pointer;font-weight:700;transition:background .2s ease}.submit-btn:hover{background-color:#e0b414}table{width:100%;border-collapse:collapse;margin:2rem 0;background:#fff;box-shadow:0 2px 8px #00000012;overflow-x:auto}.table-container{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}tbody{border-bottom:1px solid lightgray}th,td{padding:1rem 1.5rem;text-align:center;border-bottom:1px solid #e0e0e0}th{background:#f7f7fa;font-weight:600;color:#333;letter-spacing:.03em}tr:last-child td{border-bottom:none}tr:nth-child(2n) td{background:#fafbfc}tfoot{color:gray}tfoot th{background:#f7f7fa;font-weight:500;color:#666}@media (max-width: 768px){table{font-size:.85em;margin:1rem 0}th,td{padding:.5rem .3rem;white-space:nowrap}table,thead,tbody,th,td,tr{display:block}thead{display:none}tr{margin-bottom:1rem;border:1px solid #ddd;border-radius:6px;padding:.6rem;background:#fff;box-shadow:0 1px 3px #0000000d}td{display:flex;justify-content:space-between;padding:.4rem .2rem;border:none}td:before{content:attr(data-label);font-weight:600;color:#333;margin-right:.5rem}}.CircularProgressbar{width:100%;vertical-align:middle}.CircularProgressbar .CircularProgressbar-path{stroke:#3e98c7;stroke-linecap:round;-webkit-transition:stroke-dashoffset .5s ease 0s;transition:stroke-dashoffset .5s ease 0s}.CircularProgressbar .CircularProgressbar-trail{stroke:#d6d6d6;stroke-linecap:round}.CircularProgressbar .CircularProgressbar-text{fill:#3e98c7;font-size:20px;dominant-baseline:middle;text-anchor:middle}.CircularProgressbar .CircularProgressbar-background{fill:#d6d6d6}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-background{fill:#3e98c7}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-text{fill:#fff}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-path{stroke:#fff}.CircularProgressbar.CircularProgressbar-inverted .CircularProgressbar-trail{stroke:transparent}.record-container{max-width:700px;margin:0 auto;padding:2rem;text-align:center;font-family:Inter,sans-serif}.record-title{font-size:2rem;font-weight:700;margin-bottom:.5rem}.record-subtitle{color:#555;margin-bottom:2rem}.record-form{display:flex;flex-direction:column;gap:1rem;align-items:stretch}.record-label{text-align:left;font-weight:600;margin-top:1rem}.input-field{width:100%;padding:1rem;font-size:1.1rem;border-radius:8px;border:1px solid #ccc;background:#fff}.textarea-input{resize:none}.role-dropdown{position:relative;padding:1rem;background:#fff;border:1px solid #ccc;border-radius:8px;cursor:pointer;font-size:1.1rem}.role-dropdown-list{position:absolute;top:100%;left:0;width:100%;background:#fff;border:1px solid #ccc;border-radius:8px;margin-top:.25rem;z-index:20}.role-checkbox{padding:.75rem;cursor:pointer}.role-checkbox:hover{background:#f5f5f5}.record-btn-main{margin-top:2rem;background:#ffd400;border:none;border-radius:9999px;padding:1rem 2rem;font-size:1.3rem;font-weight:700;cursor:pointer;transition:background .3s ease;display:flex;justify-content:center;align-items:center;gap:.75rem}.record-btn-main:hover{background:#ffde4a}.record-overlay,.upload-overlay,.upload-success{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:50;transition:background .5s ease}.record-overlay{background:red;color:#fff}.record-overlay-content h1{font-size:2.2rem;margin-bottom:1rem}.recording-timer{font-size:3rem;margin-bottom:2rem;font-weight:600}.stop-btn{background:#fff;color:red;font-size:1.5rem;border:none;border-radius:9999px;padding:1rem 2rem;display:flex;align-items:center;gap:.5rem;cursor:pointer}.stop-btn:hover{background:#ffeaea}.upload-overlay{background:#ffd400;color:#333;transition:background .3s ease}.upload-overlay-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.uploading-title{font-size:2rem;font-weight:700}.upload-success{background:#00b050;color:#fff;font-size:2rem;font-weight:700;flex-direction:column;gap:1rem;animation:fadeIn .6s ease forwards}.success-icon{width:100px;height:100px;color:#fff}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.rota-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.help-dropdown{position:relative;display:inline-block}.help-btn{background:#0073e6;color:#fff;padding:.6rem 1rem;border:none;border-radius:6px;cursor:pointer;font-size:.95rem}.help-btn:hover{background:#005bb5}.help-dropdown-content{display:none;position:absolute;top:110%;left:0;background:#fff;min-width:220px;box-shadow:0 2px 8px #00000026;border-radius:6px;z-index:100;flex-direction:column;padding:.5rem 0}.help-dropdown:hover .help-dropdown-content{display:flex}.help-dropdown-content button{background:none;border:none;text-align:left;padding:.6rem 1rem;font-size:.9rem;cursor:pointer;width:100%}.help-dropdown-content button:hover{background:#f5f5f5}.rota-key{display:flex;gap:.5rem;align-items:center;margin-bottom:.5rem;font-size:.9rem}.key-item{padding:.25rem .5rem;border-radius:4px}.key-item.past{background:#e0e0e0;color:#555}.key-item.current{background:#fff7c2;border:1px solid #f0d000;color:#333;font-weight:700}.key-item.future{background:#fff;border:1px solid #ccc;color:#333}button{padding:.5em 1.2em;border:none;border-radius:4px;background-color:#f5c518;color:#000;font-weight:500;cursor:pointer;transition:background .2s}button:hover{background:#f5c518}.download-btn,.help-btn{background:#0073e6;color:#fff;border:none;padding:.6rem 1.2rem;margin:.5rem .5rem 0 0;border-radius:6px;font-size:.95rem;cursor:pointer;transition:background .2s ease}.download-btn:hover,.help-btn:hover{background:#005bb5}.rota-actions{display:flex;gap:.5rem}.admin-footer{display:flex;justify-content:space-between;padding:1rem;background:#f7f7fa;border:1px solid #e0e0e0;border-radius:8px;margin-top:1rem}.adminSection{width:100%;padding:.5rem;text-align:center;background:#fff;border-right:1px solid #e0e0e0;border-radius:6px}.adminSection:last-child{border-bottom:none}.adminSection h3{margin-bottom:.5rem;font-size:1rem;color:#333}.adminSection p{font-weight:600;color:#000;margin-bottom:1em;font-size:1.1em}.input-field{display:block;width:90%;margin:.5em auto 1em;padding:.7em 1em;border:1px solid #e0e0e0;border-radius:4px;background:#fff;font-size:1em;transition:border .2s,box-shadow .2s;box-sizing:border-box}.input-field:focus{border-color:#f5c518;outline:none;box-shadow:0 0 0 2px #2563eb22}.adminSection select.input-field{min-height:3em;font-size:1em;background:#fafbfc}.adminSection button.input-field{width:90%;margin-top:.5em;font-size:1em;padding:.7em 0}.role-dropdown{position:relative;cursor:pointer;background:#fff;min-height:3em;-webkit-user-select:none;user-select:none;text-align:left}.role-dropdown-list{position:absolute;left:0;right:0;top:110%;background:#fff;border:1px solid #e0e0e0;border-radius:4px;box-shadow:0 2px 8px #00000012;z-index:10;padding:.5em 0}.role-checkbox{display:flex;align-items:center;justify-content:flex-start;padding:.4em 1em;cursor:pointer;font-size:1em;gap:.6em;min-height:32px}.role-checkbox input[type=checkbox]{appearance:none;width:18px;height:18px;border:2px solid #f5c518;border-radius:3px;background:#fff;margin-right:.5em;cursor:pointer;outline:none;transition:border .2s}.role-checkbox input[type=checkbox]:checked{background:#f5c518;border-color:#f5c518}.role-checkbox input[type=checkbox]:focus{box-shadow:0 0 0 2px #f5c51822}.rota-instructions{background:#f9fafc;border:1px solid #e0e0e0;border-radius:6px;padding:1rem 1.5rem;margin:1rem 0}.rota-instructions h3{margin-bottom:.75rem;font-size:1.1rem;color:#333}.rota-instructions ol{margin:0;padding-left:1.25rem;line-height:1.5}.rota-instructions li{margin-bottom:.5rem}.text-small{font-size:.9em}.highlight-week{background-color:#fff6cc;font-weight:700}.past-week{background-color:#f2f2f2;color:#888}.spinner{width:18px;height:18px;border:3px solid #fff;border-top:3px solid #4a90e2;border-radius:50%;display:inline-block;animation:spin .8s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 900px){th,td{padding:.7rem .5rem;font-size:.95em}}@media (max-width: 768px){table{font-size:.85em;margin:1rem 0}th,td{padding:.5rem .3rem;white-space:nowrap}button{font-size:.8em;padding:.4em .8em}table,thead,tbody,th,td,tr{display:block}thead{display:none}tr{margin-bottom:1rem;border:1px solid #ddd;border-radius:6px;padding:.6rem;background:#fff;box-shadow:0 1px 3px #0000000d}td{display:flex;justify-content:space-between;padding:.4rem .2rem;border:none}td:before{content:attr(data-label);font-weight:600;color:#333;margin-right:.5rem}.admin-footer{flex-direction:column;gap:1rem;align-items:stretch}.adminSection{width:100%;border-right:none;border-bottom:1px solid #e0e0e0;padding-bottom:1rem}}.rota-toggle{background:transparent!important;color:inherit;padding:6px 10px;cursor:pointer}.rota-toggle:hover{background:#0000000d}.rota-title{font-size:2rem;font-weight:700;margin-bottom:.5rem}.recordings-container{max-width:800px;margin:2rem auto;padding:1rem}.recordings-title{font-size:2rem;font-weight:700;margin-bottom:.3rem}.recordings-subtitle{color:#666;margin-bottom:1.5rem}.recordings-list{display:flex;flex-direction:column;gap:1rem}.recording-card{display:flex;justify-content:space-between;align-items:center;background:#fafafa;border-radius:12px;padding:1rem;box-shadow:0 1px 4px #0000001a}.recording-icon{margin-right:1rem;color:#555}.recording-title-text{margin:0}.recording-meta{color:#777;font-size:.9rem}.download-btn{background:#333;color:#fff;border:none;border-radius:8px;padding:.5rem 1rem;cursor:pointer;display:flex;align-items:center;gap:.4rem}.download-btn:disabled{opacity:.6;cursor:not-allowed}
