@import "https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700&family=Public+Sans:wght@400;500;600;700&display=swap";:root{--bg:#f3f5f1;--surface:#fff;--sunk:#eaeee7;--line:#d5dccf;--text:#1d2420;--muted:#5b665e;--accent:#007f2a;--accent-ink:#fff;--accent-soft:#e2f2e6;--ok:#006b22;--ok-soft:#e2f2e6;--topbar:#111412;--topbar-ink:#fff;--warn:#a85f00;--warn-soft:#fbe9cc;--bad:#b3261e;--bad-soft:#f8dcd8;--none:#62676a;--none-soft:#e6e6e3;--display:"Barlow Condensed", "Arial Narrow", system-ui, sans-serif;--body:"Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#141917;--surface:#1c2320;--sunk:#232b27;--line:#33403a;--text:#e7ece7;--muted:#9aa79f;--accent:#4cc46a;--accent-ink:#08140c;--accent-soft:#173a22;--ok:#5fd07c;--ok-soft:#173a22;--topbar:#0b0e0c;--topbar-ink:#fff;--warn:#f0a948;--warn-soft:#3e2d14;--bad:#ff8a80;--bad-soft:#47201d;--none:#a0a4a6;--none-soft:#2a2f2d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--body);margin:0;font-size:16px;line-height:1.5}button,input,select{font:inherit;color:inherit}h1,h2,h3{font-family:var(--display);letter-spacing:.01em;margin:0;font-weight:700;line-height:1.1}.topbar{background:var(--topbar);color:var(--topbar-ink);border-bottom:4px solid var(--accent);z-index:5;position:sticky;top:0}.topbar-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;max-width:1000px;margin:0 auto;padding:12px 16px;display:flex}.brand{font-family:var(--display);text-transform:uppercase;letter-spacing:.03em;font-size:1.6rem;font-weight:700}.user{align-items:center;gap:10px;min-width:0;font-size:.85rem;display:flex}.user span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.topbar .btn-ghost{color:var(--topbar-ink);background:0 0;border-color:currentColor}.container{flex-direction:column;gap:18px;max-width:1000px;margin:0 auto;padding:20px 16px 60px;display:flex}.stats{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;display:grid}.stat{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 14px}.stat .num{font-family:var(--display);font-size:2.4rem;font-weight:700;line-height:1}.stat .label{color:var(--muted);margin-top:4px;font-size:.85rem}.stat.bad .num{color:var(--bad)}.stat.warn .num{color:var(--warn)}.card{background:var(--surface);border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:12px;min-width:0;padding:16px;display:flex}.card h2{text-transform:uppercase;font-size:1.5rem}.hint{color:var(--muted);margin:0;font-size:.9rem}.form-row{flex-wrap:wrap;gap:8px;display:flex}.form-row>*{flex:160px;min-width:0}.form-row>button{flex:none}input,select{background:var(--surface);border:1px solid var(--line);border-radius:6px;min-height:44px;padding:10px 12px}input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:6px;min-height:44px;padding:10px 16px;font-weight:600}.btn:hover{border-color:var(--muted)}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}.btn-small{min-height:34px;padding:4px 12px;font-size:.85rem}.btn-danger{color:var(--bad)}.link{color:var(--accent);cursor:pointer;text-align:left;text-underline-offset:3px;background:0 0;border:0;padding:0;font-weight:600;text-decoration:underline}.table-wrap{border:1px solid var(--line);border-radius:6px;overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.95rem}th,td{text-align:left;border-bottom:1px solid var(--line);vertical-align:middle;padding:10px 12px}th{background:var(--sunk);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;font-size:.75rem}tr:last-child td{border-bottom:0}.nowrap{white-space:nowrap}.pill{white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:2px 10px;font-size:.8rem;font-weight:700;display:inline-flex}.pill:before{content:"";background:currentColor;border-radius:50%;width:7px;height:7px}.pill-current{background:var(--ok-soft);color:var(--ok)}.pill-due{background:var(--warn-soft);color:var(--warn)}.pill-expired{background:var(--bad-soft);color:var(--bad)}.pill-none{background:var(--none-soft);color:var(--none)}.count-bad{color:var(--bad);font-weight:700}.count-ok{color:var(--ok);font-weight:700}.error{background:var(--bad-soft);color:var(--bad);border-left:4px solid var(--bad);border-radius:6px;margin:0;padding:10px 14px}.empty{border:1px dashed var(--line);text-align:center;color:var(--muted);border-radius:6px;margin:0;padding:18px}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:16px;display:flex}.login-card{width:100%;max-width:380px}.login-card .brand{color:var(--accent);font-size:2rem}.login-card form{flex-direction:column;gap:10px;display:flex}.tabs{border-bottom:2px solid var(--line);gap:4px;display:flex;overflow-x:auto}.tab{min-height:44px;font-family:var(--display);text-transform:uppercase;color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-bottom:3px solid #0000;margin-bottom:-2px;padding:10px 14px;font-size:1.15rem;font-weight:700}.tab.active{color:var(--text);border-bottom-color:var(--accent)}.course-list{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;display:grid}.course-btn{text-align:left;background:var(--surface);border:1px solid var(--line);cursor:pointer;border-radius:8px;flex-direction:column;gap:4px;min-height:44px;padding:14px;font-size:1.05rem;font-weight:700;display:flex}.course-btn:hover{border-color:var(--accent)}.course-btn span{color:var(--muted);font-size:.85rem;font-weight:400}.progress{background:var(--sunk);border-radius:3px;height:6px;overflow:hidden}.progress>div{background:var(--accent);height:100%}.lesson ul{flex-direction:column;gap:10px;max-width:65ch;margin:0;padding-left:20px;display:flex}.nav-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.question{border:1px solid var(--line);border-radius:8px;flex-direction:column;gap:8px;padding:14px;display:flex}.question .q{font-weight:600}.option{border:1px solid var(--line);background:var(--bg);cursor:pointer;border-radius:6px;align-items:flex-start;gap:10px;padding:10px 12px;display:flex}.option input[type=radio]{flex:none;width:18px;height:18px;min-height:0;margin-top:3px;padding:0}.option.right{border-color:var(--ok);background:var(--ok-soft)}.option.wrong{border-color:var(--bad);background:var(--bad-soft)}.why{color:var(--muted);margin:0;font-size:.9rem}.score{font-family:var(--display);text-align:center;font-size:4rem;font-weight:700;line-height:1}.score.pass{color:var(--ok)}.score.fail{color:var(--bad)}.center{text-align:center}.library h2{font-size:1.9rem}.library-section{border-top:1px solid var(--line);flex-direction:column;gap:8px;padding-top:14px;display:flex}.library-section h3{font-size:1.3rem}.library-section ul{flex-direction:column;gap:8px;max-width:70ch;margin:0;padding-left:20px;display:flex}.progress-summary{flex-wrap:wrap;align-items:center;gap:18px;display:flex}.progress-summary .pct{font-family:var(--display);color:var(--accent);font-size:3.6rem;font-weight:700;line-height:1}.progress-summary .pct-text{flex-direction:column;flex:220px;gap:8px;min-width:0;display:flex}.progress-big{border-radius:6px;height:12px}.eyebrow{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-size:.75rem;font-weight:700}.this-week{border:2px solid var(--accent);background:var(--accent-soft);border-radius:8px;flex-direction:column;align-items:flex-start;gap:8px;padding:14px;display:flex}.this-week-name{font-family:var(--display);font-size:1.6rem;line-height:1.1}.pctrow-small{flex-direction:column;gap:6px;width:100%;display:flex}.missing-list{columns:2 180px;margin:8px 0 0;padding-left:20px}.saved{color:var(--ok);font-weight:600}textarea{background:var(--surface);border:1px solid var(--line);width:100%;font:inherit;color:inherit;resize:vertical;border-radius:6px;padding:10px 12px;line-height:1.5}textarea:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.stack{flex-direction:column;gap:12px;display:flex}.edit-block{border:1px solid var(--line);background:var(--bg);border-radius:8px;flex-direction:column;gap:10px;padding:14px;display:flex}.edit-h{text-transform:uppercase;margin-top:8px;font-size:1.3rem}.field{color:var(--muted);flex-direction:column;gap:4px;font-size:.85rem;font-weight:600;display:flex}.field input,.field textarea{color:var(--text);font-size:1rem;font-weight:400}.row-btns{flex-wrap:wrap;gap:6px;display:flex}.opt-edit{align-items:center;gap:8px;display:flex}.opt-edit input[type=text],.opt-edit input:not([type]){flex:1;min-width:0}.opt-edit input[type=radio]{width:20px;height:20px;min-height:0;accent-color:var(--accent);flex:none;padding:0}.check{align-items:center;gap:8px;font-size:.95rem;display:flex}.check input{width:18px;height:18px;min-height:0;padding:0}.setup-code-card{border:2px solid var(--accent)}.setup-code{letter-spacing:.12em;color:var(--accent);background:var(--accent-soft);text-align:center;-webkit-user-select:all;user-select:all;border-radius:8px;padding:12px 16px;font-family:ui-monospace,Consolas,monospace;font-size:2.2rem;font-weight:700}.login-card .link{text-align:left;margin-top:12px}.brand-row{align-items:center;gap:10px;display:flex}.logo{object-fit:contain;background:#fff;border-radius:6px;flex:none;width:36px;height:36px;padding:2px}.login-card .brand-row{text-align:center;flex-direction:column;gap:8px;margin-bottom:8px}.login-card .logo{border-radius:14px;width:96px;height:96px;padding:6px}.tab{align-items:center;gap:6px;padding:10px;display:inline-flex}.tab .icon{flex:none;width:18px;height:18px}.tab-short{display:none}@media (width<=700px){.tabs{z-index:10;background:var(--surface);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom));border-bottom:0;gap:2px;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 16px #00000014}.tab{min-width:0;min-height:56px;font-family:var(--body);text-transform:none;border-bottom:0;border-radius:10px;flex-direction:column;flex:1 1 0;gap:2px;margin:0;padding:6px 2px;font-size:.72rem;font-weight:600}.tab .icon{width:22px;height:22px}.tab.active{color:var(--accent);background:var(--accent-soft)}.tab-long{display:none}.tab-short{display:inline}.container{padding-bottom:calc(100px + env(safe-area-inset-bottom))}}.t-icon{background:var(--accent-soft);width:44px;height:44px;color:var(--accent);border-radius:10px;flex:none;justify-content:center;align-items:center;display:inline-flex}.t-icon .icon{width:24px;height:24px}.course-btn{flex-direction:row;align-items:center;gap:12px}.course-btn .t-icon{color:var(--accent)}.course-btn .course-text{color:var(--text);flex-direction:column;gap:2px;font-size:1.05rem;font-weight:700;display:flex}.course-btn:hover .t-icon{background:var(--accent);color:var(--accent-ink)}.this-week-title{align-items:center;gap:12px;display:flex}.this-week .t-icon{background:var(--surface)}.ring{flex:none;width:120px;height:120px;position:relative}.ring svg{display:block;transform:rotate(-90deg)}.ring-track{fill:none;stroke:var(--sunk);stroke-width:12px}.ring-fill{fill:none;stroke:var(--accent);stroke-width:12px;stroke-linecap:round;animation:1s ease-out ring-grow}@keyframes ring-grow{0%{stroke-dashoffset:var(--full)}}.ring-text{font-family:var(--display);color:var(--accent);justify-content:center;align-items:center;font-size:2rem;font-weight:700;display:flex;position:absolute;inset:0}.pct-title{font-size:1.1rem}.progress-summary .pct-text{flex:140px;gap:4px}@media (prefers-reduced-motion:reduce){.ring-fill{animation:none}}.celebrate{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:12px 0 4px;display:flex;position:relative}.check-anim{animation:.5s cubic-bezier(.2,1.4,.4,1) both pop}.check-circle{fill:var(--accent);stroke:none}.check-mark{fill:none;stroke:var(--accent-ink);stroke-width:9px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:70;stroke-dashoffset:70px;animation:.45s ease-out .35s forwards draw}.celebrate-title{font-family:var(--display);text-transform:uppercase;color:var(--accent);font-size:3rem;font-weight:700;line-height:1;animation:.4s ease-out .5s both rise}.confetti{opacity:0;border-radius:2px;width:10px;height:10px;margin-left:-5px;animation:1s ease-out .3s forwards burst;position:absolute;top:67px;left:50%}.confetti.c0{background:var(--accent)}.confetti.c1{background:#f2b33d}.confetti.c2{background:var(--text);border-radius:50%}@keyframes pop{0%{opacity:0;transform:scale(.3)}to{opacity:1;transform:scale(1)}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes burst{0%{opacity:1;transform:rotate(var(--angle)) translateY(0) rotate(0)}to{opacity:0;transform:rotate(var(--angle)) translateY(-95px) rotate(200deg)}}@media (prefers-reduced-motion:reduce){.check-anim,.check-mark,.celebrate-title,.confetti{animation:none}.check-mark{stroke-dashoffset:0}}.tabs{overflow-y:hidden}.skeleton{background:var(--surface);border:1px solid var(--line);border-radius:8px;height:210px;position:relative;overflow:hidden}.skeleton:before{content:"";background:linear-gradient(var(--sunk) 0 0) 0 0 / 40% 26px no-repeat, linear-gradient(var(--sunk) 0 0) 0 48px / 92% 14px no-repeat, linear-gradient(var(--sunk) 0 0) 0 74px / 78% 14px no-repeat, linear-gradient(var(--sunk) 0 0) 0 100px / 85% 14px no-repeat, linear-gradient(var(--sunk) 0 0) 0 136px / 28% 40px no-repeat;position:absolute;inset:18px}.skeleton:after{content:"";background:linear-gradient(90deg,#0000,#ffffff8c,#0000);animation:1.3s ease-in-out infinite shimmer;position:absolute;inset:0;transform:translate(-100%)}@media (prefers-color-scheme:dark){.skeleton:after{background:linear-gradient(90deg,#0000,#ffffff0f,#0000)}}@keyframes shimmer{to{transform:translate(100%)}}@media (prefers-reduced-motion:reduce){.skeleton:after{animation:none}}.card .quiz-q{font-family:var(--body);text-transform:none;margin-top:6px;font-size:1.35rem;font-weight:700;line-height:1.3;animation:.25s ease-out rise}.answers{flex-direction:column;gap:10px;display:flex}.answer{text-align:left;background:var(--surface);border:2px solid var(--line);cursor:pointer;border-radius:12px;align-items:center;gap:14px;width:100%;min-height:60px;padding:12px 14px;font-size:1.05rem;line-height:1.35;display:flex}.answer:hover{border-color:var(--muted)}.answer-letter{background:var(--sunk);border-radius:50%;flex:none;justify-content:center;align-items:center;width:34px;height:34px;font-weight:700;display:inline-flex}.answer.picked{border-color:var(--accent);background:var(--accent-soft)}.answer.picked .answer-letter{background:var(--accent);color:var(--accent-ink)}.quiz-nav{margin-top:6px}.quiz-nav .btn{min-width:120px;min-height:52px;font-size:1.05rem}.status-cards{display:none}@media (width<=700px){.status-table{display:none}.status-cards{flex-direction:column;gap:8px;display:flex}.status-card{background:var(--surface);border:1px solid var(--line);border-left:5px solid var(--none);border-radius:10px;align-items:center;gap:12px;padding:12px;display:flex}.status-card[data-status=Current]{border-left-color:var(--ok)}.status-card[data-status=Due\ soon]{border-left-color:var(--warn)}.status-card[data-status=Expired]{border-left-color:var(--bad)}.status-card .t-icon{width:40px;height:40px}.status-card-text{flex-direction:column;flex:1;gap:2px;min-width:0;line-height:1.3;display:flex}.status-card-text .hint{font-size:.82rem}}.login-page{background:radial-gradient(90% 60% at 50% 0,#00aa3c61,#0000 70%),repeating-linear-gradient(135deg,#ffffff09 0 14px,#0000 14px 28px),#0d110f;flex-direction:column;gap:18px}.login-page:after{content:"Hydro Green Erosion Control";color:#fff9;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;font-weight:600}.login-card{box-shadow:inset 0 5px 0 var(--accent), 0 24px 60px #00000080;border:0;border-radius:14px;gap:14px;padding:28px 22px 22px;animation:.4s ease-out rise;overflow:hidden}.login-card h2{font-size:1.6rem}.login-card .btn-primary{min-height:50px;font-size:1.05rem}.login-card input{min-height:50px}
