:root{color-scheme:light;color:#243c36;background:#eee7d8;font-family:Arial,Helvetica,sans-serif;font-synthesis:none;accent-color:#2d675c;--ease-out: cubic-bezier(.23, 1, .32, 1)}*{box-sizing:border-box}::selection{background:#a3c2ad;color:#183d34}html{min-width:280px}body{min-width:280px;min-height:100vh;margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #4f9c83;outline-offset:3px}.site-header{border-bottom:1px solid #c7c7b7;background:#f5f0e5}.site-header-inner{display:flex;align-items:center;gap:12px;max-width:1180px;height:68px;margin:auto;padding:0 30px}.brand-mark,.pass-mark,.setup-copy-mark{display:grid;place-items:center;flex:none;border-radius:50%;background:#2d675c;color:#fff;font-family:Arial,Helvetica,sans-serif;font-weight:800}.brand-mark{width:32px;height:32px;font-size:17px}.brand-name{font-size:15px;font-weight:800;letter-spacing:-.02em}.brand-name span{padding:0 5px;color:#819187;font-weight:400}.header-link{margin-left:auto;color:#276956;font-size:12px;font-weight:800;text-decoration-thickness:1px;text-underline-offset:3px}.header-link:hover{color:#174f40}.header-link:focus-visible{outline:3px solid #4f9c83;outline-offset:3px}.workspace{max-width:1180px;margin:0 auto;padding:38px 30px 70px}.loading-note{padding:40px 0;color:#687a6d;font-size:14px}.day-line{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:31px;border-bottom:1px solid #c7c7b7;padding-bottom:15px}.day-line h1{margin:0;font-size:14px;font-weight:800;letter-spacing:-.02em}.day-line span{color:#4a6254;font-size:12px}.attendance-sheet{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);align-items:center;gap:clamp(34px,6vw,82px);min-height:540px;padding:0 22px 28px}.pass-card{--pass-rest-transform: rotate(-3deg) translateY(8px);position:relative;display:flex;flex-direction:column;width:100%;min-height:462px;padding:31px;border:1px solid #b8c1b0;border-radius:13px;background:#fffdf7;box-shadow:0 28px 40px #435b4830;transform:var(--pass-rest-transform)}.pass-card.placed{animation:pass-place .28s var(--ease-out) both}.paper-slot{position:absolute;top:12px;left:calc(50% - 23px);width:46px;height:7px;border:1px solid #caccc0;border-radius:9px;background:#f0eee4;box-shadow:inset 0 1px 2px #455c4c33}.pass-header{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding-bottom:22px;border-bottom:2px solid #34695d;font-size:12px;font-weight:800;line-height:1.35;letter-spacing:.08em}.pass-mark{width:49px;height:49px;font-size:25px;letter-spacing:0}.pass-identity{display:flex;flex-direction:column;gap:10px;margin-top:38px}.pass-identity>span:first-child{color:#50695a;font-size:11px;font-weight:800;letter-spacing:.1em}.pass-identity strong{max-width:320px;font-family:Georgia,Times New Roman,serif;font-size:clamp(33px,3.8vw,49px);font-weight:700;line-height:1.03;letter-spacing:-.04em;overflow-wrap:anywhere}.pass-nim{color:#557268;font-size:13px;font-weight:800;letter-spacing:.06em;overflow-wrap:anywhere}.pass-stamp{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;align-self:flex-end;width:143px;min-height:76px;margin:auto 2px 19px 0;border:3px solid currentColor;border-radius:50%;color:#3b6d54;font-size:9px;font-weight:800;line-height:1.1;letter-spacing:.13em;text-align:center;transform:rotate(-13deg);opacity:.8}.pass-stamp:before{position:absolute;inset:4px;border:1px dashed currentColor;border-radius:50%;content:""}.pass-stamp:after{position:absolute;inset:-3px;border-radius:50%;background:repeating-linear-gradient(104deg,transparent 0 9px,#fffdf7 10px 11px,transparent 12px 21px);content:"";opacity:.3;pointer-events:none}.pass-stamp strong{margin:3px 0;font-size:15px;font-weight:900;letter-spacing:.045em}.pass-stamp.complete{color:#29705c}.pass-stamp.impressed{animation:stamp-press .24s var(--ease-out) both}.pass-times{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding-top:17px;border-top:1px dashed #a6b6a8}.pass-times div{display:flex;flex-direction:column;gap:5px;min-width:0}.pass-times span{font-size:11px;font-weight:800;letter-spacing:.08em}.pass-times strong{font-size:15px;font-weight:800;font-variant-numeric:tabular-nums}.attendance-work{min-width:0;padding:18px 0 12px}.attendance-work h2{max-width:530px;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(37px,4.4vw,57px);line-height:1.05;letter-spacing:-.045em;text-wrap:balance}.work-description{max-width:43ch;margin:22px 0 30px;color:#4b6355;font-size:14px;line-height:1.55}.code-ticket{display:flex;width:min(100%,455px);min-height:99px;border:1px solid #4d7968;background:#fffdf7;box-shadow:5px 11px 20px #4d6b4e24;transform:rotate(1.4deg) translate(-8px)}.ticket-body{display:flex;flex:1;flex-direction:column;justify-content:center;min-width:0;padding:17px 21px}.ticket-body span{color:#4c6556;font-size:11px;font-weight:800;letter-spacing:.07em}.ticket-body output{display:block;margin-top:7px;font-size:clamp(26px,3vw,38px);font-weight:800;letter-spacing:.09em;line-height:1.08;overflow-wrap:anywhere}.ticket-body output:not(.waiting){animation:code-print .2s var(--ease-out) both}.ticket-body output.waiting{color:#69796f;font-size:21px;font-weight:600;letter-spacing:-.02em}.ticket-stamp{display:grid;place-items:center;width:110px;padding:10px;border-left:1px dashed #84a290;color:#2e6a50;font-size:11px;font-weight:800;line-height:1.3;text-align:center;transform:rotate(-8deg)}.ticket-stamp.unready{color:#9d6747}.code-status{margin:17px 0 19px;color:#4d6655;font-size:12px;line-height:1.45}.record-button{min-height:48px;padding:11px 25px;border:1px solid #2d675c;border-radius:3px;background:#2d675c;color:#fff;font-size:13px;font-weight:800;letter-spacing:.01em;transform:rotate(-.6deg);transition:background-color .16s ease,transform .16s var(--ease-out)}.record-button:active:not(:disabled){transform:rotate(-.6deg) scale(.97)}.record-button:disabled{border-color:#a5b4a7;background:#d9dfd4;color:#3e5546;transform:none}@media(hover:hover)and (pointer:fine){.record-button:hover:not(:disabled){background:#21584e;transform:rotate(0) translateY(-1px)}.record-button:hover:active:not(:disabled){transform:scale(.97)}}@keyframes pass-place{0%{opacity:.72;transform:translateY(14px) rotate(0)}to{opacity:1;transform:var(--pass-rest-transform)}}@keyframes stamp-press{0%{opacity:.35;transform:rotate(-13deg) scale(1.08)}to{opacity:.8;transform:rotate(-13deg) scale(1)}}@keyframes code-print{0%{opacity:.6;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}.action-hint{max-width:42ch;margin:12px 0 0;color:#75482e;font-size:12px;line-height:1.5}.action-hint p{margin:0}#message{max-width:42ch;margin:15px 0 0;color:#2e725b;font-size:12px;line-height:1.5}#message.error{color:#9d4e3d}.support-strip{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:end;margin-top:24px;padding:22px 14px 0;border-top:1px dashed #b1bdaf}.location-detail{min-width:0}.location-detail>span{color:#4a6254;font-size:11px;font-weight:800;letter-spacing:.1em}.location-detail p{margin:9px 0 2px;color:#385b4d;font-size:12px;line-height:1.5;overflow-wrap:anywhere}.text-button{min-height:44px;padding:10px 0;border:0;background:none;color:#276956;font-size:12px;font-weight:800;text-align:left;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}.text-button:hover:not(:disabled){color:#174f40}.text-button:disabled{color:#819a88}.action-hint .text-button{display:block;color:#70492e}.account-actions{display:flex;flex-wrap:wrap;gap:12px 24px}.account-actions .text-button:last-child{color:#9a5747}.account-actions .text-button:last-child:hover{color:#743c32}.setup-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,470px);gap:clamp(32px,7vw,90px);align-items:center;min-height:620px;padding:40px 5% 55px}.setup-intro{max-width:460px}.setup-copy-mark{width:61px;height:61px;margin-bottom:28px;font-size:32px}.setup-intro h1{margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(37px,4.6vw,58px);line-height:1.04;letter-spacing:-.045em}.setup-intro p{max-width:44ch;margin:22px 0 44px;color:#4b6355;font-size:15px;line-height:1.6}.setup-form{position:relative;display:grid;gap:20px;width:100%;padding:41px 38px 35px;border:1px solid #b8c1b0;border-radius:12px;background:#fffdf7;box-shadow:0 26px 42px #435b482b;transform:rotate(1deg)}.form-heading{display:flex;justify-content:space-between;gap:16px;margin-bottom:7px;padding-bottom:20px;border-bottom:2px solid #34695d;font-size:10px;font-weight:800;letter-spacing:.08em}.field{display:grid;gap:8px}.field label{color:#4d6658;font-size:11px;font-weight:800;letter-spacing:.03em}.field input,.field select{width:100%;min-height:46px;padding:10px 12px;border:1px solid #aebcaf;border-radius:4px;background:#fbfaf4;color:#203c33;font-size:14px}.field input::placeholder{color:#718477}.form-submit{margin-top:8px;transform:none}.form-error{margin:0;color:#9d4e3d;font-size:12px;line-height:1.5}.setup-form>.text-button{justify-self:start}@media(max-width:860px){.attendance-sheet{grid-template-columns:minmax(0,1fr);gap:38px;min-height:0;padding:0 12px}.pass-card{max-width:440px}.attendance-work{padding-left:8px}.setup-layout{grid-template-columns:1fr;min-height:0;padding:30px 3% 60px}.setup-form{max-width:500px}}@media(max-width:600px){.site-header-inner{height:60px;padding:0 18px}.brand-name{font-size:13px}.header-link{font-size:11px}.workspace{padding:25px 19px 55px}.day-line{align-items:flex-start;flex-direction:column;gap:6px;margin-bottom:19px;padding-bottom:13px}.day-line h1{font-size:13px}.day-line span{font-size:11px}.attendance-sheet{gap:19px;padding:0 4px}.pass-card{--pass-rest-transform: rotate(-1.6deg);min-height:290px;padding:22px}.pass-header{padding-bottom:12px;font-size:10px}.pass-mark{width:40px;height:40px;font-size:21px}.pass-identity{gap:6px;margin-top:16px}.pass-identity strong{max-width:230px;font-size:31px}.pass-nim{font-size:10px}.pass-stamp{width:119px;min-height:64px;margin-bottom:10px;font-size:8px}.pass-stamp strong{font-size:12px}.pass-times{gap:10px;padding-top:9px}.pass-times span{font-size:10px}.pass-times strong{font-size:12px}.attendance-work{padding:0}.attendance-work h2{font-size:34px}.work-description{margin:12px 0 19px;font-size:13px}.code-ticket{min-height:82px;transform:rotate(1deg) translate(-3px)}.ticket-body{padding:13px 15px}.ticket-body output{font-size:27px}.ticket-body output.waiting{font-size:18px}.ticket-stamp{width:88px;padding:7px;font-size:10px}.code-status{margin:11px 0 13px}.record-button{width:100%}.support-strip{grid-template-columns:1fr;gap:16px;margin-top:35px;padding:18px 4px 0}.account-actions{gap:10px 20px}.setup-layout{gap:30px;padding:18px 0 40px}.setup-copy-mark{width:45px;height:45px;margin-bottom:20px;font-size:23px}.setup-intro h1{font-size:37px}.setup-intro p{margin:13px 0 22px;font-size:13px}.setup-form{gap:17px;padding:34px 22px 27px;transform:rotate(.4deg)}}@media(max-width:600px)and (max-height:700px){.workspace{padding-top:15px}.day-line{margin-bottom:15px}.attendance-sheet{gap:14px}.pass-card{min-height:208px;padding:14px 18px}.paper-slot{top:6px}.pass-header{align-items:center;padding-bottom:5px;font-size:10px}.pass-mark{width:30px;height:30px;font-size:16px}.pass-identity{gap:3px;margin-top:7px}.pass-identity>span:first-child{font-size:10px}.pass-identity strong{font-size:25px}.pass-nim{font-size:10px}.pass-stamp{display:none}.pass-times{margin-top:auto;padding-top:6px}.pass-times span{font-size:10px}.pass-times strong{font-size:11px}.attendance-work h2{font-size:31px}.work-description{margin:8px 0 12px;font-size:12px}.code-ticket{min-height:72px}.ticket-body{padding:9px 14px}.ticket-body output{font-size:24px}.code-status{margin:8px 0 9px}}@media(prefers-reduced-motion:reduce){.pass-card.placed,.ticket-body output:not(.waiting){animation:ink-fade .12s ease-out both}.pass-stamp.impressed{animation:stamp-fade .12s ease-out both}.record-button{transition:background-color .12s ease}.record-button:active:not(:disabled),.record-button:hover:active:not(:disabled){transform:rotate(-.6deg)}}@keyframes ink-fade{0%{opacity:.7}to{opacity:1}}@keyframes stamp-fade{0%{opacity:.5}to{opacity:.8}}
