@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Sarabun:wght@300;400;500;600;700&family=Be+Vietnam+Pro:wght@300;400;500;600;700&family=Cormorant+Garamond:wght@400;500;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Fredoka:wght@500;600;700&family=Quicksand:wght@400;500;700&family=Mali:wght@400;600;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Cormorant+Garamond:wght@400;500;600;700&display=swap";
@layer reset,base,theme,components,utilities;@layer reset{*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-moz-text-size-adjust:100%;text-size-adjust:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-block-size:100dvh;line-height:1.6}img,picture,video,canvas,svg{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}a{color:inherit;text-decoration:none}ul,ol{list-style:none}h1,h2,h3,h4,h5,h6{text-wrap:balance;overflow-wrap:break-word}p{text-wrap:pretty;overflow-wrap:break-word}}@layer base{:root{--page-ground:#f6f4f0;--color-warm-50:#faf8f5;--color-warm-100:#f5f1ec;--color-warm-200:#e8e3dc;--color-warm-300:#d4cec5;--color-warm-400:#b5afa5;--color-warm-500:#918b82;--color-warm-600:#6b6560;--color-warm-700:#4a4540;--color-warm-800:#2c2a27;--color-warm-900:#1a1918;--color-sage-100:#e8efe3;--color-sage-200:#c8d6be;--color-sage-300:#a8bd99;--color-sage-400:#8ba87a;--color-sage-500:#7c8e6b;--color-sage-600:#5e6d51;--color-sage-700:#4a5540;--color-gold-100:#f5edd8;--color-gold-200:#e8d9b1;--color-gold-300:#d4c08a;--color-gold-400:#c4a35a;--color-gold-500:#a8893c;--color-gold-600:#8a6f2e;--color-sky-100:#e3eef5;--color-sky-200:#b8d4e8;--color-sky-300:#8dbad6;--color-sky-400:#6aa0c4;--color-sky-500:#4a7ea8;--color-red-100:#f5e3e3;--color-red-400:#c47070;--color-red-600:#a84a4a;--color-day-group1:#e6e1fa;--color-day-group2:#d8edd8;--color-day-group3:#d6eaf8;--day-btn-opacity-unselected:.9;--color-bg-primary:var(--color-warm-50);--color-bg-secondary:var(--color-warm-100);--color-bg-card:#fff;--color-bg-elevated:#fff;--color-bg-overlay:#2c2a2780;--color-surface:var(--color-warm-100);--color-surface-hover:var(--color-warm-200);--color-primary:var(--color-accent);--color-text-primary:var(--color-warm-800);--color-text-secondary:var(--color-warm-600);--color-text-tertiary:var(--color-warm-500);--color-text-inverse:var(--color-warm-50);--color-accent:var(--color-sage-500);--color-accent-hover:var(--color-sage-600);--color-accent-soft:var(--color-sage-100);--color-accent-warm:var(--color-gold-400);--color-accent-warm-soft:var(--color-gold-100);--color-border:var(--color-warm-200);--color-border-subtle:var(--color-warm-100);--color-success:var(--color-sage-500);--color-warning:var(--color-gold-400);--color-error:var(--color-red-400)}@media (prefers-color-scheme:dark){:root{--page-ground:#0d1130;--color-bg-primary:var(--color-warm-900);--color-bg-secondary:#222120;--color-bg-card:#2d2b28;--color-bg-elevated:#353230;--color-bg-overlay:#0009;--color-surface:#222120;--color-surface-hover:#353230;--color-primary:var(--color-accent);--color-text-primary:#e8e4df;--color-text-secondary:#9b9590;--color-text-tertiary:#7a756f;--color-text-inverse:var(--color-warm-900);--color-accent:#9aad86;--color-accent-hover:#aabf96;--color-accent-soft:#2a3125;--color-accent-warm:#d4b96a;--color-accent-warm-soft:#3a3325;--color-border:#3a3735;--color-border-subtle:#302d2a;--color-success:#9aad86;--color-warning:#d4b96a;--color-error:#d48a8a;--color-day-group1:#4a405a;--color-day-group2:#405a40;--color-day-group3:#3a4d60;--day-btn-opacity-unselected:.6}}:root{--shadow-xs:0 1px 2px #2c2a270d;--shadow-sm:0 2px 4px #2c2a270f;--shadow-md:0 4px 12px #2c2a2714;--shadow-lg:0 8px 24px #2c2a271a;--shadow-xl:0 16px 48px #2c2a271f}@media (prefers-color-scheme:dark){:root{--shadow-xs:0 1px 2px #0003;--shadow-sm:0 2px 4px #00000040;--shadow-md:0 4px 12px #0000004d;--shadow-lg:0 8px 24px #00000059;--shadow-xl:0 16px 48px #0006}}:root{--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--font-thai:"Sarabun", "Noto Sans Thai", sans-serif;--font-latin:"Inter", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--font-size-xs:clamp(.7rem, .65rem + .25vw, .75rem);--font-size-sm:clamp(.8rem, .75rem + .25vw, .875rem);--font-size-base:clamp(.875rem, .825rem + .25vw, 1rem);--font-size-md:clamp(1rem, .925rem + .375vw, 1.125rem);--font-size-lg:clamp(1.125rem, 1rem + .625vw, 1.375rem);--font-size-xl:clamp(1.375rem, 1.125rem + 1.25vw, 1.75rem);--font-size-2xl:clamp(1.75rem, 1.375rem + 1.875vw, 2.5rem);--font-size-3xl:clamp(2rem, 1.5rem + 2.5vw, 3rem);--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--line-height-tight:1.25;--line-height-normal:1.6;--line-height-relaxed:1.8;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-2xl:1.5rem;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-slow:.4s ease;--transition-spring:.3s cubic-bezier(.34, 1.56, .64, 1);--z-dropdown:100;--z-sticky:200;--z-overlay:300;--z-modal:400;--z-toast:500;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark}body{font-family:var(--font-latin);font-size:var(--font-size-base);color:var(--color-text-primary);background-color:var(--page-ground);transition:background-color var(--transition-normal), color var(--transition-normal)}[lang=th] body,.font-thai{font-family:var(--font-thai)}:root{--max-width-content:48rem;--max-width-wide:64rem;--max-width-full:80rem;--header-height:3.5rem;--nav-height:3.5rem}}@layer theme{[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg-primary:var(--color-warm-50);--color-bg-secondary:var(--color-warm-100);--color-bg-card:#fff;--color-bg-elevated:#fff;--color-bg-overlay:#2c2a2780;--color-surface:var(--color-warm-100);--color-surface-hover:var(--color-warm-200);--color-primary:var(--color-accent);--color-text-primary:var(--color-warm-800);--color-text-secondary:var(--color-warm-600);--color-text-tertiary:var(--color-warm-500);--color-text-inverse:var(--color-warm-50);--color-accent:var(--color-sage-500);--color-accent-hover:var(--color-sage-600);--color-accent-soft:var(--color-sage-100);--color-accent-warm:var(--color-gold-400);--color-accent-warm-soft:var(--color-gold-100);--color-border:var(--color-warm-200);--color-border-subtle:var(--color-warm-100);--shadow-xs:0 1px 2px #2c2a270d;--shadow-sm:0 2px 4px #2c2a270f;--shadow-md:0 4px 12px #2c2a2714;--shadow-lg:0 8px 24px #2c2a271a;--color-day-group1:#e6e1fa;--color-day-group2:#d8edd8;--color-day-group3:#d6eaf8;--day-btn-opacity-unselected:.9}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--page-ground:#0d1130;--color-bg-primary:var(--color-warm-900);--color-bg-secondary:#222120;--color-bg-card:#2d2b28;--color-bg-elevated:#353230;--color-bg-overlay:#0009;--color-surface:#222120;--color-surface-hover:#353230;--color-primary:var(--color-accent);--color-text-primary:#e8e4df;--color-text-secondary:#9b9590;--color-text-tertiary:#7a756f;--color-text-inverse:var(--color-warm-900);--color-accent:#9aad86;--color-accent-hover:#aabf96;--color-accent-soft:#2a3125;--color-accent-warm:#d4b96a;--color-accent-warm-soft:#3a3325;--color-border:#3a3735;--color-border-subtle:#302d2a;--shadow-xs:0 1px 2px #0003;--shadow-sm:0 2px 4px #00000040;--shadow-md:0 4px 12px #0000004d;--shadow-lg:0 8px 24px #00000059;--color-day-group1:#4a405a;--color-day-group2:#405a40;--color-day-group3:#3a4d60;--day-btn-opacity-unselected:.6}.group-a{--group-color:var(--color-sage-400);--group-bg:var(--color-sage-100)}.group-b{--group-color:var(--color-sky-400);--group-bg:var(--color-sky-100)}.group-c{--group-color:var(--color-gold-400);--group-bg:var(--color-gold-100)}.group-mc{--group-color:var(--color-warm-600);--group-bg:var(--color-warm-200)}.group-reg{--group-color:var(--color-red-400);--group-bg:var(--color-red-100)}@media (prefers-color-scheme:dark){.group-a{--group-bg:var(--color-sage-700)}.group-b{--group-bg:#1e3040}.group-c{--group-bg:#3a3325}.group-mc{--group-bg:var(--color-warm-700)}.group-reg{--group-bg:#3a2525}}[data-theme=dark] .group-a{--group-bg:var(--color-sage-700)}[data-theme=dark] .group-b{--group-bg:#1e3040}[data-theme=dark] .group-c{--group-bg:#3a3325}[data-theme=dark] .group-mc{--group-bg:var(--color-warm-700)}[data-theme=dark] .group-reg{--group-bg:#3a2525}}@layer components{.card{background:var(--color-bg-card);border:1px solid var(--color-border-subtle);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-sm);transition:box-shadow var(--transition-normal), transform var(--transition-normal)}.card:hover:not(:disabled){box-shadow:var(--shadow-md);transform:translateY(-1px)}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-5);min-block-size:2.75rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:1px solid #0000;text-decoration:none;display:inline-flex}.btn:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.btn-primary{background:var(--color-accent);color:#fff;border-color:var(--color-accent)}.btn-primary:hover:not(:disabled){background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.btn-secondary{color:var(--color-text-primary);border-color:var(--color-border);background:0 0}.btn-secondary:hover:not(:disabled){background:var(--color-bg-secondary);border-color:var(--color-text-tertiary)}.btn-danger{color:var(--color-error);background:0 0;border-color:#0000}.btn-danger:hover:not(:disabled){background:var(--color-red-100);color:var(--color-red-600)}@media (prefers-color-scheme:dark){.btn-danger:hover:not(:disabled){color:var(--color-error);background:#d48a8a1a}}[data-theme=dark] .btn-danger:hover:not(:disabled){color:var(--color-error);background:#d48a8a1a}.btn-ghost{color:var(--color-text-secondary);background:0 0;border-color:#0000}.btn-ghost:hover:not(:disabled){background:var(--color-bg-secondary);color:var(--color-text-primary)}.btn-warm{background:var(--color-accent-warm);color:#fff;border-color:var(--color-accent-warm)}.btn:disabled{opacity:.5;cursor:not-allowed}.badge{align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);background:var(--color-accent-soft);color:var(--color-accent);display:inline-flex}.badge-warm{background:var(--color-accent-warm-soft);color:var(--color-accent-warm)}.badge-group{background:var(--group-bg,var(--color-bg-secondary));color:var(--group-color,var(--color-text-secondary))}.input{inline-size:100%;padding:var(--space-2) var(--space-4);min-block-size:2.75rem;font-size:var(--font-size-base);color:var(--color-text-primary);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);display:block}.input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-soft);outline:none}.input:user-invalid{border-color:var(--color-error)}.input::placeholder{color:var(--color-text-tertiary)}.search-input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23918B82' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:var(--space-3) center;background-size:1.125rem;padding-inline-start:2.75rem}.container{inline-size:100%;max-inline-size:var(--max-width-content);padding-inline:var(--space-4);margin-inline:auto}.container-wide{max-inline-size:var(--max-width-wide)}.header{z-index:var(--z-sticky);block-size:var(--header-height);padding-inline:var(--space-4);background:var(--color-bg-primary);border-block-end:1px solid var(--color-border-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);justify-content:space-between;align-items:center;display:flex;position:sticky;inset-block-start:0}.bottom-nav{z-index:var(--z-sticky);block-size:var(--nav-height);background:var(--color-bg-card);border-block-start:1px solid var(--color-border-subtle);justify-content:space-around;align-items:center;padding-block-end:env(safe-area-inset-bottom,0);display:flex;position:fixed;inset-block-end:0;inset-inline:0;box-shadow:0 -2px 8px #0000000d}.bottom-nav a,.bottom-nav button{padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs);color:var(--color-text-tertiary);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-block-size:44px;min-inline-size:44px;display:flex}.bottom-nav a.active,.bottom-nav button.active{color:var(--color-accent)}.timeline{flex-direction:column;gap:0;padding-inline-start:var(--space-6);display:flex;position:relative}.timeline:before{content:"";background:var(--color-border);inline-size:2px;position:absolute;inset-block:0;inset-inline-start:.75rem}.timeline-item{padding:var(--space-3) 0;padding-inline-start:var(--space-4);position:relative}.timeline-item:before{content:"";border-radius:var(--radius-full);background:var(--color-border);border:2px solid var(--color-bg-primary);z-index:1;block-size:.625rem;inline-size:.625rem;position:absolute;inset-block-start:var(--space-4);inset-inline-start:calc(-1 * var(--space-6) + .5rem)}.timeline-item.active:before{background:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-soft)}.timeline-item.completed:before{background:var(--color-accent)}.empty-state{justify-content:center;align-items:center;gap:var(--space-4);padding:var(--space-12) var(--space-6);text-align:center;color:var(--color-text-tertiary);flex-direction:column;display:flex}.empty-state svg{opacity:.4}}@layer utilities{.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.text-center{text-align:center}.text-sm{font-size:var(--font-size-sm)}.text-xs{font-size:var(--font-size-xs)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.text-accent{color:var(--color-accent)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.mt-2{margin-block-start:var(--space-2)}.mt-4{margin-block-start:var(--space-4)}.mt-6{margin-block-start:var(--space-6)}.mb-2{margin-block-end:var(--space-2)}.mb-4{margin-block-end:var(--space-4)}.w-full{inline-size:100%}@keyframes rowFlash{0%{background-color:color-mix(in srgb, var(--warning) 32%, transparent)}to{background-color:#0000}}.row-flash,.row-flash>td{animation:2.4s ease-out rowFlash}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes breathe{0%,to{opacity:1;transform:scale(1)}50%{opacity:.8;transform:scale(1.05)}}@keyframes pulse-ring{0%{opacity:1;transform:scale(.85)}to{opacity:0;transform:scale(1.5)}}.animate-fade-in{animation:.3s backwards fadeIn}.animate-slide-up{animation:.4s backwards slideUp}.animate-breathe{animation:3s ease-in-out infinite breathe}.delay-1{animation-delay:50ms}.delay-2{animation-delay:.1s}.delay-3{animation-delay:.15s}.delay-4{animation-delay:.2s}.delay-5{animation-delay:.25s}@media (prefers-reduced-motion:reduce){.animate-fade-in,.animate-slide-up,.animate-breathe{animation:none}}}.page-with-nav{padding-block-end:calc(var(--nav-height) + env(safe-area-inset-bottom,0) + var(--space-4))}:root{--color-scrollbar-track:var(--color-bg-secondary);--color-scrollbar-thumb:var(--color-warm-300);scrollbar-color:var(--color-scrollbar-thumb) var(--color-scrollbar-track);scrollbar-width:thin}@media (prefers-color-scheme:dark){:root{--color-scrollbar-thumb:var(--color-warm-600)}}.theme-asa,.theme-volunteer,.theme-teacher{--ash-deep:#181e4f;--limestone:#d3cac1;--pale-ash:#e7e6e2;--gold-leaf:#ac8150;--paper:#f6f4f0;--sky-wash:#c4d9da;--navy-950:#0b0e26;--navy-900:#0d1130;--navy-850:#141a3d;--navy-800:#181e4f;--navy-700:#232a63;--navy-600:#333b7d;--navy-500:#4a5397;--navy-400:#6d76b3;--navy-300:#9aa1cd;--navy-200:#c5c9e2;--navy-100:#e3e5f0;--sand-50:#fbfaf8;--sand-100:#f6f4f0;--sand-200:#e7e6e2;--sand-300:#d3cac1;--sand-400:#b5aa9e;--sand-500:#8f857a;--sand-600:#6b6259;--gold-100:#f4eadc;--gold-200:#e2cbab;--gold-300:#c9a06a;--gold-400:#ac8150;--gold-500:#8a6740;--sky-100:#eaf3f4;--sky-200:#c4d9da;--sky-300:#9ec1c3;--sky-400:#6d9ba0;--sky-500:#3d6b71;--sky-900:#1e3448;--success-100:#e2ece4;--success-500:#4f7d5f;--success-700:#385c45;--danger-100:#f3e3e1;--danger-500:#a8524a;--danger-700:#833c35;--bg-page:var(--paper);--bg-sunken:var(--sand-200);--bg-surface:#fff;--bg-card:#fff;--bg-elevated:#fff;--bg-inverse:var(--ash-deep);--bg-overlay:#181e4f6b;--viewfinder-bg:#000;--viewfinder-scrim:#00000073;--viewfinder-guide:#ffffffe6;--viewfinder-guide-soft:#ffffffbf;--viewfinder-text:#fff;--viewfinder-text-shadow:0 1px 4px #0009;--text-primary:var(--ash-deep);--text-secondary:#3a4068;--text-tertiary:#6b7090;--text-muted:#8b8fa5;--text-inverse:var(--paper);--text-accent:var(--gold-leaf);--border-strong:var(--sand-300);--border:var(--sand-200);--border-subtle:#f0eeea;--rule:var(--limestone);--accent:var(--gold-leaf);--accent-hover:var(--gold-500);--accent-soft:var(--gold-100);--accent-cool:var(--sky-200);--accent-cool-soft:var(--sky-100);--action:var(--ash-deep);--action-hover:var(--navy-700);--action-text:var(--paper);--focus-ring:var(--navy-500);--success:var(--success-500);--success-soft:var(--success-100);--danger:var(--danger-500);--danger-soft:var(--danger-100);--warning:var(--gold-leaf);--warning-soft:var(--gold-100);--font-display:"Cormorant Garamond","Sarabun",Georgia,serif;--font-text:"Be Vietnam Pro","Sarabun",system-ui,sans-serif;--font-thai:"Sarabun","Be Vietnam Pro",sans-serif;--font-mono:ui-monospace,"SF Mono",Menlo,monospace;--display-weight:600;--text-display-lg:54px;--text-display-md:40px;--text-display-sm:30px;--text-2xl:24px;--text-xl:20px;--text-lg:18px;--text-md:16px;--text-sm:15px;--text-xs:13px;--text-2xs:11px;--leading-tight:1.34;--leading-normal:1.66;--leading-relaxed:1.8;--leading-thai:1.72;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--eyebrow-size:11px;--eyebrow-weight:600;--eyebrow-tracking:.18em;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--tap-min:48px;--radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:18px;--radius-xl:24px;--radius-pill:999px;--shadow-xs:0 1px 2px #181e4f0d;--shadow-sm:0 2px 6px #181e4f0f;--shadow-md:0 6px 18px #181e4f14;--shadow-lg:0 14px 36px #181e4f1a;--shadow-xl:0 24px 64px #181e4f24;--ease:cubic-bezier(.32,.72,.28,1);--ease-out:cubic-bezier(.16,1,.3,1);--duration-fast:.14s;--duration-normal:.24s;--duration-slow:.42s;background:var(--bg-page);color:var(--text-primary);font-family:var(--font-text)}[lang=th] .theme-asa,.theme-asa[lang=th],.theme-asa .font-thai{font-family:var(--font-thai)}[data-theme=dark] .theme-asa,[data-theme=dark] .theme-volunteer{--bg-page:var(--navy-900);--bg-sunken:var(--navy-950);--bg-surface:var(--navy-850);--bg-card:#1a2149;--bg-elevated:#222a58;--bg-inverse:var(--paper);--bg-overlay:#060816a8;--text-primary:#eeecf4;--text-secondary:#b9bed6;--text-tertiary:#8d94b6;--text-muted:#737a9c;--text-inverse:var(--ash-deep);--text-accent:var(--gold-300);--border-strong:#3a447a;--border:#2d3668;--border-subtle:#232a55;--rule:#2d3668;--accent:var(--gold-300);--accent-hover:var(--gold-200);--accent-soft:#3a2f20;--accent-cool:var(--sky-200);--accent-cool-soft:var(--sky-900);--action:var(--gold-300);--action-hover:var(--gold-200);--action-text:var(--navy-950);--focus-ring:var(--navy-300);--success:#7fae8d;--success-soft:#233a2b;--danger:#d18a82;--danger-soft:#3d2523;--warning:var(--gold-300);--warning-soft:#3a2f20;--shadow-xs:0 1px 2px #0000004d;--shadow-sm:0 2px 6px #0000005c;--shadow-md:0 6px 18px #00000070;--shadow-lg:0 14px 36px #00000080;--shadow-xl:0 24px 64px #00000094}@media (prefers-color-scheme:dark){html:not([data-theme=light]) .theme-asa,html:not([data-theme=light]) .theme-volunteer{--bg-page:var(--navy-900);--bg-sunken:var(--navy-950);--bg-surface:var(--navy-850);--bg-card:#1a2149;--bg-elevated:#222a58;--bg-inverse:var(--paper);--bg-overlay:#060816a8;--text-primary:#eeecf4;--text-secondary:#b9bed6;--text-tertiary:#8d94b6;--text-muted:#737a9c;--text-inverse:var(--ash-deep);--text-accent:var(--gold-300);--border-strong:#3a447a;--border:#2d3668;--border-subtle:#232a55;--rule:#2d3668;--accent:var(--gold-300);--accent-hover:var(--gold-200);--accent-soft:#3a2f20;--accent-cool:var(--sky-200);--accent-cool-soft:var(--sky-900);--action:var(--gold-300);--action-hover:var(--gold-200);--action-text:var(--navy-950);--focus-ring:var(--navy-300);--success:#7fae8d;--success-soft:#233a2b;--danger:#d18a82;--danger-soft:#3d2523;--warning:var(--gold-300);--warning-soft:#3a2f20;--shadow-xs:0 1px 2px #0000004d;--shadow-sm:0 2px 6px #0000005c;--shadow-md:0 6px 18px #00000070;--shadow-lg:0 14px 36px #00000080;--shadow-xl:0 24px 64px #00000094}}.theme-asa.admin-shell{--color-bg:var(--bg-page);--color-background:var(--bg-page);--color-bg-primary:var(--bg-page);--color-bg-secondary:var(--bg-sunken);--color-bg-card:var(--bg-card);--color-bg-elevated:var(--bg-elevated);--color-bg-overlay:var(--bg-overlay);--color-surface:var(--bg-sunken);--color-surface-hover:var(--border-strong);--color-text:var(--text-primary);--color-text-primary:var(--text-primary);--color-text-secondary:var(--text-secondary);--color-secondary:var(--text-secondary);--color-text-tertiary:var(--text-tertiary);--color-text-inverse:var(--text-inverse);--color-primary:var(--action);--color-accent:var(--accent);--color-accent-hover:var(--accent-hover);--color-accent-soft:var(--accent-soft);--color-accent-warm:var(--accent);--color-accent-warm-soft:var(--accent-soft);--color-border:var(--border);--color-border-subtle:var(--border-subtle);--color-success:var(--success);--color-warning:var(--warning);--color-error:var(--danger);--color-danger:var(--danger);--color-danger-soft:var(--danger-soft);--color-red-100:var(--danger-soft);--color-red-600:var(--danger);--color-warm-700:var(--text-secondary);--color-gold-200:var(--accent-soft);--color-sky-100:var(--accent-cool-soft);--color-sky-500:var(--accent-cool);--color-sage-100:var(--success-soft);--color-sage-600:var(--success)}.theme-asa.participant-shell{min-height:100vh}.theme-volunteer{--ground:var(--bg-page);--card:var(--bg-card);--card-edge:var(--border);--ink:var(--text-primary);--ink-soft:var(--text-tertiary);--display:var(--text-primary);--pill-ink:var(--text-primary);--pink:var(--accent-soft);--lav:var(--accent-cool-soft);--mint:var(--success-soft);--accent-deep:var(--accent-hover);--good:var(--success);--good-bg:var(--success-soft);--r-lg:var(--radius-lg);--r-md:var(--radius-md);--r-pill:var(--radius-pill);--v-font-display:var(--font-display);--v-font-body:var(--font-text);--sky:var(--accent-cool);--peach:#f1e7da;--mascot-skin:#f3e3ce;--shadow:0 10px 30px #181e4f1a;background-color:var(--ground);color:var(--ink);font-family:var(--v-font-body)}[lang=th] .theme-volunteer,.theme-volunteer[lang=th],.theme-volunteer .font-thai{--v-font-display:"Sarabun", "Cormorant Garamond", serif;--v-font-body:var(--font-thai)}[data-theme=dark] .theme-volunteer{--sky:var(--accent-cool-soft);--peach:#2a2a4a;--shadow:0 10px 30px #00000073}@media (prefers-color-scheme:dark){html:not([data-theme=light]) .theme-volunteer{--sky:var(--accent-cool-soft);--peach:#2a2a4a;--shadow:0 10px 30px #00000073}}.theme-teacher{--ash-deep:#181e4f;--limestone:#d3cac1;--pale-ash:#e7e6e2;--gold-leaf:#ac8150;--paper:#f6f4f0;--sky-wash:#c4d9da;--t-bg:var(--paper);--t-text:var(--ash-deep);--t-card:#faf8f4;--t-border:#1c19161f;--t-muted:#6b6a76;--t-accent:var(--gold-leaf);--t-wash:var(--sky-wash);--t-line:var(--limestone);--t-radius:14px;--t-shadow:0 10px 30px #181e4f0f;--t-font-display:"Playfair Display", var(--font-thai), serif;--t-font-body:"Inter", var(--font-thai), sans-serif;--bg-page:var(--t-bg);--bg-sunken:var(--pale-ash);--bg-surface:var(--t-card);--bg-card:var(--t-card);--bg-elevated:var(--t-card);--text-primary:var(--t-text);--text-secondary:var(--t-muted);--text-tertiary:var(--t-muted);--text-muted:var(--t-muted);--border:var(--t-border);--border-strong:var(--t-line);--border-subtle:var(--t-border);--rule:var(--t-line);--accent:var(--t-accent);--accent-cool:var(--t-wash);--action:var(--t-text);--action-text:var(--t-bg);--radius-md:var(--t-radius);--shadow-md:var(--t-shadow);--font-display:var(--t-font-display);--font-text:var(--t-font-body);background-color:var(--t-bg);color:var(--t-text);font-family:var(--t-font-body)}[lang=th] .theme-teacher,.theme-teacher[lang=th],.theme-teacher .font-thai{--t-font-display:"Sarabun", "Playfair Display", serif;--t-font-body:"Sarabun", "Inter", sans-serif}[data-theme=dark] .theme-teacher{--ash-deep:#f3efe8;--limestone:#3d3731;--pale-ash:#2c2823;--gold-leaf:#c59b68;--paper:#1a1814;--sky-wash:#1e3a3f;--t-card:#22201c;--t-border:#f3efe81f;--t-muted:#a8a29e;--t-shadow:0 10px 30px #00000059}@media (prefers-color-scheme:dark){html:not([data-theme=light]) .theme-teacher{--ash-deep:#f3efe8;--limestone:#3d3731;--pale-ash:#2c2823;--gold-leaf:#c59b68;--paper:#1a1814;--sky-wash:#1e3a3f;--t-card:#22201c;--t-border:#f3efe81f;--t-muted:#a8a29e;--t-shadow:0 10px 30px #00000059}}.day-btn{cursor:pointer;width:80px;height:80px;color:var(--color-text-primary);border:2px solid #0000;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:1.1rem;font-weight:500;transition:all .2s;display:flex}.day-btn-selected{border:2px solid var(--color-accent);box-shadow:var(--shadow-md);opacity:1;font-weight:700;transform:scale(1.05)}.day-btn-unselected{opacity:var(--day-btn-opacity-unselected,.6);box-shadow:var(--shadow-xs)}.day-btn-disabled{cursor:not-allowed}.day-btn-date{opacity:.8;font-size:.8rem;font-weight:400}.roster-checkbox{appearance:none;background-color:var(--color-bg-card);border:2px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;width:1.15rem;height:1.15rem;transition:all var(--transition-fast);outline:none;place-content:center;margin:0;padding:0;display:inline-grid}.roster-checkbox:hover:not(:disabled){border-color:var(--color-accent)}.roster-checkbox:before{content:"";background-color:var(--color-accent);transform-origin:50%;clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);width:.6rem;height:.6rem;transition:transform .1s ease-in-out;transform:scale(0)}.roster-checkbox:checked:before{transform:scale(1)}.roster-checkbox:disabled{opacity:.6;cursor:not-allowed}.roster-checkbox:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}@keyframes spin{0%{transform:translateY(-50%)rotate(0)}to{transform:translateY(-50%)rotate(360deg)}}