.attendance-page{width:min(1080px,100%);margin:auto;padding:clamp(22px,5vw,58px)}.attendance-page>header{display:grid;grid-template-columns:120px 1fr;gap:24px;margin-bottom:38px;padding-bottom:22px;border-bottom:1px solid var(--ink)}.attendance-page>header>a{align-self:start;color:var(--muted);font-size:.78rem;font-weight:700;text-decoration:none}.attendance-page>header>a:hover{color:var(--green)}.attendance-page h1{margin:2px 0 5px;font-size:clamp(2rem,5vw,3.6rem);line-height:1;letter-spacing:-.05em}.attendance-page>header span{color:var(--green);font-size:.7rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.attendance-page>header p{max-width:58ch;margin:0;color:var(--muted)}.attendance-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:min(760px,100%);margin-left:144px}.attendance-form label,.period label,#manual-scan label{display:grid;gap:7px;color:#34413b;font-size:.76rem;font-weight:750}.attendance-form label:has(textarea),.attendance-form>.field-wide,.attendance-form>.error,.attendance-form>.form-actions,.attendance-form>.upload-field{grid-column:1/-1}.attendance-form input,.attendance-form select,.attendance-form textarea,.toolbar input,.student select,#manual-scan input{width:100%;min-height:48px;padding:11px 13px;border:1px solid #cbd1cd;border-radius:0;background:#fff;color:var(--ink);transition:border-color .18s,box-shadow .18s}.attendance-form textarea{resize:vertical}.attendance-form input:focus,.attendance-form select:focus,.attendance-form textarea:focus,.toolbar input:focus,#manual-scan input:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(14,107,79,.1);outline:0}.period{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-note{grid-column:1/-1;margin:-3px 0 0;color:var(--muted);font-size:.75rem}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:5px;padding-top:18px;border-top:1px solid var(--line)}button,.primary{min-height:44px;padding:10px 16px;border:1px solid #bcc7c1;border-radius:0;background:#fff;color:var(--ink);font-weight:750;cursor:pointer;transition:background .18s,color .18s,transform .18s}button:hover{background:#edf1ee}.primary{border-color:var(--green);background:var(--green);color:#fff}.primary:hover{background:var(--green-dark)}button:active,.primary:active{transform:translateY(1px)}button:disabled{cursor:not-allowed;opacity:.45}.summary{display:grid;grid-template-columns:repeat(6,1fr);margin-bottom:25px;border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}.summary div{display:grid;gap:4px;padding:16px 14px;border-right:1px solid var(--line)}.summary div:last-child{border:0}.summary b{font-size:1.65rem;line-height:1;letter-spacing:-.04em}.summary small{color:var(--muted);font-size:.67rem}.toolbar{display:flex;gap:8px;margin:18px 0}.toolbar input{flex:1}.toolbar button{white-space:nowrap}.toolbar #open-scanner{border-color:var(--ink);background:var(--ink);color:#fff}.student-list{display:grid;padding-bottom:100px;border-top:1px solid var(--ink)}.student{display:grid;grid-template-columns:42px 1fr minmax(170px,auto);align-items:center;gap:14px;padding:14px 8px;border-bottom:1px solid var(--line);background:transparent;transition:background .15s,padding .15s}.student:hover{padding-right:14px;padding-left:14px;background:#fff}.student .number{display:grid;height:36px;place-items:center;background:var(--green-soft);color:var(--green-dark);font-size:.78rem}.student div{display:grid;gap:2px}.student strong{font-size:.86rem}.student small{color:var(--muted);font-size:.7rem}.sticky-action{position:fixed;z-index:20;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:flex-end;gap:18px;padding:12px max(16px,calc((100vw - 1080px)/2 + 24px));border-top:1px solid var(--line);background:rgba(244,243,239,.93);backdrop-filter:blur(14px)}dialog{width:min(620px,calc(100% - 24px));padding:0;border:0;background:#fff;color:var(--ink);box-shadow:0 30px 100px rgba(0,0,0,.3)}dialog::backdrop{background:rgba(9,20,15,.72);backdrop-filter:blur(4px)}.scanner-head{display:flex;justify-content:space-between;padding:22px 24px 15px}.scanner-head h2{margin:0;font-size:1.5rem;letter-spacing:-.035em}.scanner-head form button{min-width:42px;padding:0;border:0;font-size:1.5rem}.scanner-copy{margin:0;padding:0 24px 18px;color:var(--muted);font-size:.82rem}.scanner-frame{position:relative;overflow:hidden;aspect-ratio:16/10;margin:0;background:#101814}.scanner-frame::before,.scanner-frame::after{position:absolute;z-index:2;content:"";pointer-events:none}.scanner-frame::before{inset:17%;border:2px solid rgba(255,255,255,.8)}.scanner-frame::after{top:50%;right:17%;left:17%;height:2px;background:var(--amber);box-shadow:0 0 14px var(--amber);animation:scanline 2.2s ease-in-out infinite}.scanner-frame video{width:100%;height:100%;object-fit:cover}.scanner-manual{padding:20px 24px 24px}.scanner-manual>span{display:block;margin-bottom:10px;color:var(--muted);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}#manual-scan{display:grid;grid-template-columns:1fr auto;align-items:end;gap:9px}#scan-feedback{min-height:24px;margin:12px 0 0;font-size:.8rem;font-weight:700}.flow-steps{display:flex;gap:0;width:min(760px,100%);margin:0 0 28px 144px;border-bottom:1px solid var(--line)}.flow-steps span{padding:8px 22px 8px 0;color:var(--muted);font-size:.7rem}.flow-steps span.active{color:var(--green);font-weight:800}.scan-callout{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px;padding:17px 20px;border-left:4px solid var(--amber);background:#fff}.scan-callout div{display:grid}.scan-callout strong{font-size:.9rem}.scan-callout small{color:var(--muted)}
@keyframes scanline{0%,100%{transform:translateY(-55px);opacity:.45}50%{transform:translateY(55px);opacity:1}}@media(max-width:760px){.attendance-page{padding:24px 16px 90px}.attendance-page>header{grid-template-columns:1fr;gap:16px;margin-bottom:28px}.attendance-form,.flow-steps{margin-left:0}.summary{grid-template-columns:repeat(3,1fr)}.summary div:nth-child(3){border-right:0}.toolbar{display:grid;grid-template-columns:1fr 1fr}.toolbar input{grid-column:1/-1}.student{grid-template-columns:38px 1fr}.student select{grid-column:1/-1}.sticky-action{justify-content:space-between}.scan-callout{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.attendance-form{grid-template-columns:1fr}.attendance-form>*,.attendance-form label,.period{grid-column:1}.period{grid-template-columns:1fr 1fr}.flow-steps{overflow-x:auto}.flow-steps span{white-space:nowrap}.summary{grid-template-columns:1fr 1fr}.summary div:nth-child(3){border-right:1px solid var(--line)}.summary div:nth-child(2n){border-right:0}#manual-scan{grid-template-columns:1fr}.scanner-frame{aspect-ratio:4/3}}