:root{--ink:#17221e;--muted:#66736d;--green:#52684b;--green-dark:#40543a;--green-soft:#e9efe5;--line:#dfe5dc;--panel:#fff;--canvas:#f6f8f4;--danger:#9f3b35;--shadow:0 18px 50px #23342817}*{box-sizing:border-box}html{background:var(--canvas)}body{color:var(--ink);background:var(--canvas);margin:0;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,sans-serif}button,input,select,textarea{font:inherit}button{color:inherit}.loading-screen,.login-page{place-items:center;min-height:100svh;padding:24px;display:grid}.loading-screen{color:var(--muted);align-content:center;gap:14px}.loader{border:3px solid var(--green-soft);border-top-color:var(--green);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-page{background:radial-gradient(circle at 20% 0%, #eef2eb 0, transparent 36%), var(--canvas)}.login-card{border:1px solid var(--line);width:min(440px,100%);box-shadow:var(--shadow);text-align:center;background:#fff;border-radius:24px;padding:38px}.login-logo{width:min(310px,100%);margin:0 auto 28px;display:block}.login-card h1{margin:8px 0 10px;font-size:30px}.login-copy,.privacy-copy{color:var(--muted);line-height:1.7}.privacy-copy{margin:18px 0 0;font-size:12px}.login-form{text-align:left;gap:14px;margin-top:25px;display:grid}.login-form label,.modal-form label{gap:7px;display:grid}.login-form label span,.modal-form label span{color:#526059;font-size:13px;font-weight:650}input,select,textarea{border:1px solid var(--line);width:100%;min-height:46px;color:var(--ink);background:#fff;border-radius:11px;outline:none;padding:10px 13px}textarea{resize:vertical}input:focus,select:focus,textarea:focus{border-color:#8fa188;box-shadow:0 0 0 3px #52684b1f}.button{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:11px;min-height:44px;padding:10px 18px;font-weight:700;transition:all .16s}.button:hover{transform:translateY(-1px);box-shadow:0 6px 18px #2a392d14}.button:disabled{opacity:.55;cursor:wait;transform:none}.button.primary{color:#fff;background:var(--green);border-color:var(--green)}.button.primary:hover{background:var(--green-dark)}.button.secondary{background:#fff}.button-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.alert{border-radius:10px;padding:11px 13px;font-size:13px}.alert.error{color:#7d2c27;background:#fff0ee;border:1px solid #f1cfcb}.app-shell{min-height:100svh}.sidebar{z-index:20;border-right:1px solid var(--line);background:#fffffff5;flex-direction:column;width:250px;padding:28px 18px 22px;display:flex;position:fixed;inset:0 auto 0 0}.brand-logo{width:210px;height:auto;margin:8px auto 36px}.sidebar nav{gap:7px;display:grid}.sidebar nav button{color:#637069;text-align:left;cursor:pointer;background:0 0;border:0;border-radius:13px;align-items:center;gap:14px;padding:14px 16px;display:flex}.sidebar nav button span{text-align:center;width:22px;font-size:20px}.sidebar nav button.active{background:var(--green-soft);color:var(--green-dark);font-weight:750}.network-status{color:var(--muted);align-items:center;gap:8px;margin-top:auto;font-size:12px;display:flex}.network-status i,.status-line i{background:#78a56f;border:2px solid #dcebd8;border-radius:50%;width:9px;height:9px}.network-status.offline i{background:#c1645e;border-color:#f2d7d4}.main-content{width:min(1230px,100% - 250px);margin-left:250px;padding:45px 48px 100px}.topbar{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px;display:flex}.topbar h1{letter-spacing:-.035em;margin:7px 0 0;font-size:clamp(29px,3vw,38px)}.eyebrow{color:#76877c;letter-spacing:.18em;margin:0;font-family:Georgia,serif;font-size:11px;font-weight:700}.eyebrow.green{color:var(--green)}.account-menu{color:var(--muted);align-items:center;gap:12px;font-size:12px;display:flex}.account-menu button,.text-button{color:var(--green);cursor:pointer;background:0 0;border:0;padding:7px 9px;font-weight:700}.view{animation:.22s appear}@keyframes appear{0%{opacity:0;transform:translateY(4px)}}.welcome-card,.checkin-header-card{border:1px solid var(--line);background:#fff;border-radius:20px;justify-content:space-between;align-items:center;gap:20px;padding:30px;display:flex;box-shadow:0 7px 25px #29382c09}.welcome-card h2,.checkin-header-card h2{margin:9px 0 7px;font-size:clamp(22px,2.5vw,30px)}.welcome-card p,.checkin-header-card p{color:var(--muted);margin-bottom:0}.status-line{align-items:center;gap:8px;font-size:13px;font-weight:700;display:flex;color:var(--green)!important}.stats-grid{grid-template-columns:repeat(4,1fr);gap:14px;margin:20px 0 34px;display:grid}.stat-card{border:1px solid var(--line);background:#fff;border-radius:15px;align-items:center;gap:14px;padding:20px;display:flex}.stat-card>span{background:var(--green-soft);width:42px;height:42px;color:var(--green);border-radius:12px;place-items:center;font-size:21px;display:grid}.stat-card strong{font-size:24px;display:block}.stat-card p{color:var(--muted);margin:2px 0 0;font-size:12px}.section-heading,.page-actions,.group-header{justify-content:space-between;align-items:center;gap:20px;display:flex}.section-heading{margin:8px 0 13px}.section-heading h2,.group-header h2{margin:5px 0 0}.event-list,.history-list{gap:10px;display:grid}.event-row,.history-item{border:1px solid var(--line);text-align:left;background:#fff;border-radius:15px;align-items:center;gap:16px;width:100%;padding:16px 18px;display:flex}button.event-row{cursor:pointer}.event-row-copy,.history-copy{flex:1;min-width:0}.event-row h3,.history-item h3{margin:0 0 5px;font-size:15px}.event-row p,.history-item p{color:var(--muted);margin:0;font-size:12px}.date-badge{width:50px;height:50px;color:var(--green-dark);background:#f1f5ee;border-radius:12px;align-content:center;place-items:center;display:grid}.date-badge strong{font-size:18px;line-height:1}.date-badge small{margin-top:4px;font-size:10px}.status-chip{color:#927047;white-space:nowrap;background:#f4eadc;border-radius:999px;padding:6px 9px;font-size:11px}.status-chip.completed{background:var(--green-soft);color:var(--green)}.toolbar{align-items:center;gap:10px;margin:22px 0 18px;display:flex}.sticky-toolbar{z-index:8;background:var(--canvas);padding:10px 0;position:sticky;top:0}.grow{flex:1}.search-field{display:block;position:relative}.search-field span{color:var(--muted);position:absolute;top:12px;left:14px}.search-field input{padding-left:39px}.toolbar select{width:180px}.inactive-toggle{border:1px solid var(--line);white-space:nowrap;height:46px;color:var(--muted);background:#fff;border-radius:11px;align-items:center;gap:8px;padding:0 13px;font-size:13px;display:flex}.inactive-toggle input{width:auto;min-height:0}.category-tabs{gap:8px;padding:0 0 14px;display:flex;overflow-x:auto}.category-tabs button{border:1px solid var(--line);white-space:nowrap;cursor:pointer;background:#fff;border-radius:999px;padding:9px 13px}.category-tabs button.active{color:#fff;background:var(--green);border-color:var(--green)}.category-tabs span{opacity:.65;font-size:11px}.attendance-list{gap:9px;display:grid}.attendance-person{border:1px solid var(--line);background:#fff;border-radius:14px;align-items:center;gap:16px;padding:13px 14px;display:flex}.attendance-person.checked{background:#fcfdfb;border-color:#cbd8c6}.attendance-person.directory-result{border-style:dashed}.person-main{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.avatar{background:var(--green-soft);width:42px;height:42px;color:var(--green);border-radius:12px;flex:0 0 42px;place-items:center;font-weight:800;display:grid}.avatar.infrequent{color:#866b45;background:#f4eee4}.avatar.youth{color:#586a8a;background:#edf0f7}.person-copy{flex:1;min-width:0}.person-copy h3{text-overflow:ellipsis;white-space:nowrap;margin:0 0 4px;font-size:15px;overflow:hidden}.person-copy p{color:var(--muted);margin:0;font-size:11px}.status-options{grid-template-columns:repeat(3,58px);gap:6px;display:grid}.status-options button,.attendance-remove,.person-card-actions button{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:9px;min-height:34px;padding:6px 9px;font-size:12px}.status-options button.active.present{color:#fff;background:var(--green);border-color:var(--green)}.status-options button.active.online{color:#fff;background:#607a9c;border-color:#607a9c}.status-options button.active.absent{color:#fff;background:#999;border-color:#999}.attendance-remove{color:var(--danger);white-space:nowrap;margin-left:auto}.page-actions{margin-bottom:18px}.muted{color:var(--muted)}.people-groups{gap:24px;display:grid}.people-group{border:1px solid var(--line);background:#fff;border-radius:17px;overflow:hidden}.inactive-group{border-color:#e5d7d5}.group-header{border-bottom:1px solid var(--line);padding:15px 18px}.group-header h2{margin:0;font-size:16px}.group-header span{color:var(--muted);font-size:12px}.people-grid{grid-template-columns:repeat(2,1fr);display:grid}.person-card{border-bottom:1px solid var(--line);align-items:center;gap:11px;min-width:0;padding:13px 17px;display:flex}.person-card:nth-child(odd){border-right:1px solid var(--line)}.person-card.inactive{opacity:.7;background:#faf8f8}.person-card-actions{gap:5px;display:flex}.person-card-actions button{min-height:30px}.history-list{margin-top:18px}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#131d1885;place-items:center;padding:22px;display:grid;position:fixed;inset:0}.modal{background:#fff;border-radius:20px;width:min(590px,100%);max-height:calc(100svh - 44px);padding:25px;overflow:auto;box-shadow:0 28px 90px #14201940}.modal.small{width:min(450px,100%)}.modal-header{justify-content:space-between;align-items:flex-start;margin-bottom:20px;display:flex}.modal-header h2{margin:6px 0 0}.modal-header>button{border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:50%;width:38px;height:38px;font-size:20px}.modal-form{grid-template-columns:repeat(2,1fr);gap:15px 12px;display:grid}.modal-form .full{grid-column:1/-1}.modal-actions{justify-content:flex-end;flex-direction:row!important;display:flex!important}.temporary-note{color:var(--muted);margin:-2px 0 0;font-size:12px}.toast{z-index:200;color:#fff;max-width:min(390px,100vw - 48px);box-shadow:var(--shadow);background:#26352b;border-radius:12px;padding:13px 17px;position:fixed;bottom:24px;right:24px}.empty-state{text-align:center;color:var(--muted);padding:50px 25px}.empty-state.small{padding:25px}.hero-empty{margin-top:70px}.empty-icon{background:var(--green-soft);width:55px;height:55px;color:var(--green);border-radius:50%;place-items:center;margin:0 auto 15px;font-size:25px;display:grid}.bottom-nav{display:none}@media (width<=950px){.sidebar{width:210px}.brand-logo{width:180px}.main-content{width:calc(100% - 210px);margin-left:210px;padding:34px 28px 100px}.stats-grid{grid-template-columns:repeat(2,1fr)}.people-grid{grid-template-columns:1fr}.person-card:nth-child(odd){border-right:0}}@media (width<=700px){.sidebar{display:none}.main-content{width:100%;padding:23px 16px calc(92px + env(safe-area-inset-bottom));margin:0}.topbar{margin-bottom:20px}.topbar h1{font-size:29px}.account-menu span{display:none}.welcome-card,.checkin-header-card{flex-direction:column;align-items:flex-start;padding:21px}.welcome-card .button-row,.checkin-header-card .button-row{width:100%}.welcome-card .button,.checkin-header-card .button{flex:1}.stats-grid{grid-template-columns:repeat(2,1fr);gap:9px}.stat-card{gap:10px;padding:14px}.stat-card>span{width:36px;height:36px}.toolbar{flex-wrap:wrap;align-items:stretch}.toolbar .search-field{flex-basis:100%}.toolbar select,.inactive-toggle{flex:1;width:auto}.sticky-toolbar{top:0}.attendance-person{flex-direction:column;align-items:stretch;gap:10px}.status-options{grid-template-columns:repeat(3,1fr)}.person-card{padding:13px}.person-card-actions{flex-direction:column}.history-item{flex-wrap:wrap;align-items:flex-start}.history-item .button-row{justify-content:flex-end;width:100%}.modal-form{grid-template-columns:1fr}.modal-form label{grid-column:1!important}.bottom-nav{z-index:50;padding:7px 8px calc(7px + env(safe-area-inset-bottom));border-top:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff5;grid-template-columns:repeat(4,1fr);display:grid;position:fixed;inset:auto 0 0}.bottom-nav button{color:var(--muted);background:0 0;border:0;place-items:center;gap:2px;padding:5px;display:grid}.bottom-nav button span{font-size:20px}.bottom-nav button.active{color:var(--green);font-weight:750}.toast{right:16px;bottom:calc(82px + env(safe-area-inset-bottom))}}@media (width<=420px){.stats-grid{grid-template-columns:1fr}.login-card{padding:29px 22px}.section-heading{align-items:flex-end}}
