@font-face{font-family:Sarabun;src:url('Sarabun-Regular.ttf')}@font-face{font-family:Sarabun;src:url('Sarabun-SemiBold.ttf');font-weight:600}*{box-sizing:border-box}body{margin:0;font-family:Sarabun,system-ui,sans-serif;color:#173c32;background:#f3f7f4;font-size:16px;line-height:1.6}button,input,select,textarea{font:inherit}button,.btn{border:0;border-radius:12px;background:#126448;color:white;padding:11px 19px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;transition:.15s}button:hover,.btn:hover{background:#0b4e36;transform:translateY(-1px)}button:disabled{opacity:.55;cursor:wait;transform:none}button.secondary,.btn.secondary{color:#215745;background:#e8f2eb}button.danger{color:#a33535;background:#fff0ef}button.small,.btn.small{padding:7px 12px;font-size:14px;border-radius:9px}button.ghost{color:#285746;background:transparent}a{color:#126448}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(28px,3vw,43px);line-height:1.3;letter-spacing:-.5px;font-weight:600;margin-bottom:16px}h2{font-size:23px;font-weight:600;margin-bottom:15px}h3{font-size:19px;font-weight:600;margin-bottom:10px}.muted{color:#6b8178}.eyebrow{font-family:system-ui,sans-serif;color:#42836c;font-size:12px;font-weight:700;letter-spacing:2px;margin-bottom:12px}.shell{max-width:1320px;margin:auto;padding:28px 36px}.topbar{background:white;border-bottom:1px solid #e0eae2;padding:18px 36px;display:flex;justify-content:space-between;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:25px}.brand img{width:340px;max-width:45vw;height:auto}.brand-title{border-left:1px solid #dce5df;padding-left:24px;font-size:16px;font-weight:600}.brand-title small{display:block;color:#799084;font-size:12px;letter-spacing:1.3px;font-family:system-ui,sans-serif}.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1.5fr 1fr;gap:30px;border-radius:27px;background:#124f3a;color:white;padding:44px 48px;margin-bottom:28px;box-shadow:0 18px 42px #15483012}.hero:after{content:'';width:380px;height:380px;position:absolute;right:-100px;top:-160px;border:65px solid #ffffff08;border-radius:50%;pointer-events:none}.hero .eyebrow{color:#add6bd}.hero p{color:#c9ded2;max-width:620px;margin-bottom:22px}.hero h1{max-width:670px}.hero .btn{background:#d5b66f;color:#254735}.hero-side{position:relative;z-index:1;align-self:center;padding:24px;background:#ffffff0c;border:1px solid #ffffff20;border-radius:21px}.hero-side .big{font-size:62px;line-height:1.2;font-family:system-ui,sans-serif;letter-spacing:-3px}.hero-side small{color:#c4dbcd}.steps{display:flex;gap:12px;margin-top:20px}.step-dot{border-radius:50%;background:#ffffff18;width:30px;height:30px;display:inline-grid;place-items:center;margin-right:6px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:28px 0 20px}.section-head h2{margin:0}.grid{display:grid;gap:20px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.card{background:white;border:1px solid #e0eae3;border-radius:20px;padding:25px;box-shadow:0 4px 12px #173a2b03}.activity-card{display:flex;flex-direction:column;min-height:265px}.activity-card .card-top{display:flex;justify-content:space-between;margin-bottom:18px}.icon-tile{width:46px;height:46px;border-radius:13px;background:#e6f2e9;display:grid;place-items:center;color:#227652;font-size:22px}.activity-card .details{color:#75867e;font-size:14px;display:grid;gap:5px;margin:8px 0 20px}.activity-card .btn{width:100%;margin-top:auto}.badge{display:inline-flex;align-items:center;gap:5px;border-radius:30px;padding:4px 11px;font-size:12px;font-weight:600;background:#eef2ef;color:#6d7b73;white-space:nowrap}.badge.open,.badge.success{background:#e3f4e7;color:#24734b}.badge.closed{background:#f6ebe8;color:#9b6055}.badge.draft{background:#fff5dc;color:#9a7632}.dot{width:6px;height:6px;border-radius:50%;background:currentColor}.footer{padding:30px;text-align:center;font-size:13px;color:#88998e}.empty{padding:50px 20px;text-align:center;color:#788a80;border:1px dashed #ccdcd0;border-radius:17px;background:#ffffff66;grid-column:1/-1}.empty strong{display:block;color:#355c48;font-size:20px;margin-bottom:9px}.nav{display:flex;gap:5px;border-bottom:1px solid #dce6de;margin-bottom:25px;overflow-x:auto;padding-bottom:12px}.nav button{white-space:nowrap;background:transparent;color:#789084}.nav button.active{background:#155b40;color:white}.title-row{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0 24px}.title-row h1{font-size:29px;margin:0}.title-row p{margin:4px 0 0}.stat{padding:22px}.stat .number{font-size:38px;font-family:system-ui,sans-serif;color:#155a3e;font-weight:600;margin-top:4px;line-height:1.3}.stat .caption{font-size:13px;color:#829389}.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:end;margin-bottom:20px}.toolbar label{min-width:130px;flex:1}.toolbar .wide{flex:2}.table-wrap{overflow:auto;border:1px solid #e4ebe5;border-radius:13px;max-height:560px}table{width:100%;border-collapse:collapse;white-space:nowrap;font-size:14px}th{background:#f0f6f1;color:#5a7967;text-align:left;font-weight:600;position:sticky;top:0;z-index:1}th,td{padding:13px 15px;border-bottom:1px solid #e9efea}td .sub{font-size:12px;color:#8b9b91}tbody tr:hover{background:#f8fbf8}td .actions{display:flex;gap:5px}.pager{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:16px;font-size:14px;color:#7d8f82}.pagination{display:flex;gap:8px;align-items:center}.full{grid-column:1/-1}label{display:grid;gap:6px;font-size:14px;color:#496b58}input,select,textarea{width:100%;padding:11px 13px;border:1px solid #d4e0d6;border-radius:11px;color:#244833;background:white;outline:none;min-height:47px}input:focus,select:focus,textarea:focus{border-color:#388561;box-shadow:0 0 0 3px #2f8d6012}textarea{resize:vertical;min-height:100px}input[type=checkbox]{width:18px;min-height:18px}label.check{display:flex;align-items:center;gap:10px}input.code{font-size:24px;font-family:system-ui,sans-serif;letter-spacing:2px;text-align:center;min-height:64px}dialog{padding:0;border:0;border-radius:22px;max-width:720px;width:calc(100% - 30px);box-shadow:0 30px 100px #082c3240;color:#173c32}dialog::backdrop{background:#102e2466;backdrop-filter:blur(4px)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:22px 26px;border-bottom:1px solid #e4ece5}.modal-head h2{margin:0}.modal-body{padding:26px;max-height:72vh;overflow:auto}.form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.notice{padding:15px 18px;border-radius:13px;background:#edf4ef;margin:18px 0;color:#476b53}.notice.error{color:#a43d3d;background:#fff0ee}.notice.success{color:#176141;background:#e5f5e9}.login{max-width:440px;margin:45px auto}.login .logo{width:100%;height:auto;margin-bottom:25px}.login form{display:grid;gap:17px}.checkin-layout{max-width:1040px;margin:20px auto;display:grid;grid-template-columns:.9fr 1.1fr;gap:26px}.event-info{background:#15563e;color:white;border-radius:22px;padding:32px}.event-info p{color:#c9ded0}.event-meta{margin-top:30px;display:grid;gap:20px;font-size:14px}.event-meta small{display:block;color:#a7c9b3;font-size:12px}.check-form{padding:30px}.check-form button.full-btn{width:100%;margin-top:16px;min-height:52px}.person{border:1px solid #dce8de;background:#f5faf5;padding:22px;border-radius:16px;margin-top:22px}.avatar{width:70px;height:70px;border-radius:50%;object-fit:cover;float:left;margin-right:15px}.success-icon{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;color:#247345;background:#dff0e2;font-size:36px;margin:10px auto 22px;animation:pop .35s ease-out}.result{text-align:center}.result h2{color:#23754d}.result time{display:block;font-size:27px;margin:16px 0}.chart{height:220px;display:flex;align-items:end;gap:10px;padding-top:20px;overflow:auto;border-bottom:1px solid #e0e9e2}.bar-col{flex:1;min-width:38px;height:100%;display:flex;flex-direction:column;justify-content:end;text-align:center;font-size:12px;color:#74897b}.bar{background:#418a61;border-radius:6px 6px 0 0;min-height:3px;margin:5px 5px 0}.bar-label{padding:8px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.split-chart{display:flex;height:16px;border-radius:20px;overflow:hidden;background:#e7ece6;margin:15px 0}.split-chart i{background:#3a8a5e}.chart-legend{display:flex;justify-content:space-between;font-size:13px}.qr{text-align:center}.qr-box{display:flex;justify-content:center;padding:24px;background:white}.qr-box img,.qr-box canvas{max-width:100%}.qr-link{word-break:break-all;font-family:system-ui,sans-serif;font-size:12px;color:#86918a}.install{max-width:820px;margin:40px auto;padding:35px;background:white;border-radius:24px;border:1px solid #dce8df}.install-logo{width:420px;max-width:90%;margin-bottom:30px}.install h2{margin-top:28px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#163f2d;color:white;padding:14px 24px;border-radius:13px;max-width:90%;box-shadow:0 8px 30px #0002;z-index:99}.toast.error{background:#9d3d39}.loading{padding:50px;text-align:center;color:#79917e}.spin{display:inline-block;border:3px solid #dceadd;border-top-color:#227a50;width:28px;height:28px;border-radius:50%;animation:rotate .8s linear infinite}.hidden{display:none!important}#reader{min-height:160px}#reader video{border-radius:14px}#reader button{margin:6px}#reader a{color:#216d49}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes pop{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:1000px){.grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-title{display:none}.hero{padding:32px}.shell{padding:22px}.topbar{padding:16px 22px}}@media(max-width:650px){body{font-size:15px}.shell{padding:18px 15px}.topbar{padding:13px 15px;gap:12px;flex-wrap:wrap}.brand img{width:285px;max-width:100%}.top-actions{margin-left:auto}.top-actions .username{display:none}.hero{grid-template-columns:1fr;padding:28px 25px;border-radius:20px;gap:16px}.hero-side{padding:18px;display:flex;align-items:center;gap:20px}.hero-side .big{font-size:40px}.hero-side .steps{display:none}.hero h1{font-size:29px}.hero p{font-size:14px}.grid.three,.grid.two,.checkin-layout{grid-template-columns:1fr}.grid.four{gap:12px}.stat{padding:17px}.stat .number{font-size:30px}.card{padding:20px}.title-row{align-items:flex-start;flex-wrap:wrap}.title-row h1{font-size:25px}.toolbar{gap:10px}.toolbar label{min-width:130px}.modal-body{padding:20px}.check-form{padding:23px}.event-info{padding:25px}.event-meta{grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}.checkin-layout{gap:16px;margin-top:5px}.install{margin:15px;padding:22px}.nav{gap:0}.nav button{font-size:14px;padding:10px 12px}.footer{padding:22px 15px;font-size:12px}}@media print{.topbar,.nav,.footer,.no-print,.toolbar,.pager,.form-actions,.modal-head button{display:none!important}body{background:white}.shell{padding:0}.card{box-shadow:none;border:0}.table-wrap{max-height:none;overflow:visible}dialog{position:static;max-width:100%;width:100%;box-shadow:none}dialog::backdrop{background:white}.modal-body{max-height:none}body:has(dialog[open]) #app{display:none}.qr-box img,.qr-box canvas{width:280px!important;height:280px!important}th{position:static}}

.history-profile{display:flex;gap:20px;align-items:center;margin-bottom:24px}.history-profile h2{margin-bottom:6px}.history-profile p{margin:0}.history-stats{margin:18px 0}.history-stats .stat{background:#f0f6f0;border-radius:14px;padding:18px}.history-stats .number{font-size:25px}.history-event,.history-location{white-space:normal;min-width:150px}.history-event{min-width:220px}.history-sheet .table-wrap{max-height:none}.history-scope{font-size:13px}@media print{.history-sheet{padding:0}.history-profile{margin:12px 0}.history-stats{grid-template-columns:repeat(4,1fr)!important;gap:10px}.history-stats .number{font-size:19px}.history-sheet table{white-space:normal;font-size:11px}.history-sheet th,.history-sheet td{padding:8px}.history-event,.history-location{min-width:0}.history-note{font-size:11px}.history-sheet tr{break-inside:avoid}.history-sheet thead{display:table-header-group}}
