:root{--ink:#171717;--paper:#f8f8f6;--line:#d3d3ce;--muted:#777;--soft:#ecece8}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Pretendard,"Noto Sans KR",sans-serif}header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 6vw;border-bottom:1px solid var(--line)}header a{color:var(--ink);font-size:13px;text-decoration:none}main{width:min(100% - 48px,1180px);margin:auto;padding:80px 0 120px}h1{margin:8px 0 35px;font-size:58px;letter-spacing:-.08em}h2{margin:0 0 22px;font-size:22px;letter-spacing:-.06em}#login-view{max-width:420px;margin:auto}.top{display:flex;justify-content:space-between;align-items:start}.top p{font-size:11px;color:var(--muted);letter-spacing:.08em}.plain{border:0;background:none;text-decoration:underline}.tabs{display:flex;gap:20px;border-bottom:1px solid var(--ink);margin:35px 0}.tabs button{padding:13px 2px;border:0;border-bottom:2px solid transparent;background:none;color:var(--muted);font:600 14px Pretendard,"Noto Sans KR",sans-serif}.tabs button.active{color:var(--ink);border-bottom-color:var(--ink)}.panel{display:none}.panel.active{display:block}.grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}.card{padding:30px;background:#fff;border-top:1px solid var(--ink)}form{display:grid;gap:15px}label{display:grid;gap:7px;font-size:13px;font-weight:600}input,select{padding:13px;border:1px solid var(--line);background:#fff;font:inherit}button{padding:12px 16px;border:1px solid var(--ink);background:var(--ink);color:#fff;font:600 13px Pretendard,"Noto Sans KR",sans-serif;cursor:pointer}.message{min-height:22px;color:#a22;font-size:13px}.hint,.empty{color:var(--muted);font-size:13px;line-height:1.7}.code{margin:17px 0;font-size:46px;font-weight:800;letter-spacing:.13em}.countdown{margin:-7px 0 14px;color:#a22;font-weight:700;font-size:14px}.qr{width:250px;min-height:250px}.qr img{display:block;width:250px;height:250px}.session-link{display:inline-block;color:var(--ink);font-size:13px}.matrix-head{display:flex;justify-content:space-between;align-items:end;gap:20px}.matrix-head p{color:var(--muted);font-size:13px}.matrix-head select,.matrix-head button{margin-left:8px}.table-wrap{overflow:auto;margin-top:25px;border:1px solid var(--line);background:#fff}table{border-collapse:collapse;width:max-content;min-width:100%}th,td{padding:11px 14px;border:1px solid var(--line);font-size:12px;white-space:nowrap;text-align:left}th{background:var(--soft);font-weight:700}pre{padding:16px;background:var(--soft);font-size:12px;line-height:1.8;overflow:auto}@media(max-width:700px){main{width:min(100% - 32px,1180px);padding-top:55px}h1{font-size:46px}.grid{grid-template-columns:1fr}.matrix-head{align-items:start;flex-direction:column}.matrix-head select,.matrix-head button{margin:0 6px 0 0}}
/* 출석 유효시간은 60초입니다. */
/* 관리자 시작 버튼 표기를 실제 유효시간과 맞춥니다. */
#start-form>button{font-size:0}#start-form>button::after{content:"60초 출석 시작";font-size:13px}
#session-card .hint{font-size:0}#session-card .hint::after{content:"QR 코드와 출석 코드는 60초 후 자동으로 닫힙니다.";font-size:13px}