:root{color-scheme:light;font-family:ui-rounded,SF Pro Rounded,Nunito,PingFang SC,system-ui,sans-serif;color:#102031;background:#f3fcff;background:oklch(.985 .012 220);--surface: oklch(1 0 0);--surface-soft: oklch(.965 .026 210);--ink: oklch(.22 .045 252);--muted: oklch(.43 .035 248);--primary: oklch(.64 .18 225);--primary-strong: oklch(.52 .2 228);--school-red: oklch(.58 .22 28);--school-coral: oklch(.72 .16 35);--flower: oklch(.66 .22 28);--success: oklch(.63 .16 155);--border: oklch(.88 .03 230);--shadow: 0 8px 24px oklch(.55 .08 230 / .12)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh;overflow-x:hidden;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit}button{border:0;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.shell{width:min(100%,760px);min-height:100vh;min-height:100dvh;margin:0 auto;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}.centered{display:grid;place-items:center}.loading-card,.identify-panel,.study-card,.finish-panel,.share-panel,.calendar-panel{background:var(--surface);border:1px solid var(--border);border-radius:16px}.loading-card{display:grid;justify-items:center;gap:12px;width:min(100%,520px);padding:32px 22px;color:var(--muted);text-align:center;box-shadow:var(--shadow)}.loading-card strong{color:var(--ink);font-size:1.1rem}.loading-date{display:inline-flex;align-items:center;min-height:34px;padding:0 12px;color:var(--school-red);background:#fff2ec;background:oklch(.97 .055 42);border-radius:999px;font-size:.94rem;font-weight:900}.loading-title{max-width:14ch;margin:2px 0 0;color:var(--ink);font-size:1.72rem;line-height:1.18;text-wrap:balance}.loading-note{max-width:26rem;margin:0;color:var(--muted);font-size:1.02rem;font-weight:750;line-height:1.75;text-wrap:pretty}.loading-dots{display:inline-flex;gap:7px;align-items:center;min-height:24px}.loading-dots i{width:8px;height:8px;background:var(--primary);border-radius:50%;animation:loadingPulse .95s ease-in-out infinite}.loading-dots i:nth-child(2){animation-delay:.14s}.loading-dots i:nth-child(3){animation-delay:.28s}.loading-card button{min-height:46px;padding:0 16px;color:#fff;background:var(--primary);border-radius:12px;font-weight:900}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;margin-bottom:18px}.brand-strip{display:flex;align-items:center;gap:10px;min-height:92px;margin-bottom:14px;padding:12px 14px;overflow:hidden;color:#fff;background:radial-gradient(circle at 88% 18%,oklch(.88 .11 58 / .95) 0 8px,transparent 9px),linear-gradient(135deg,var(--school-red),var(--school-coral));border-radius:16px}.brand-strip img{width:58px;height:auto;flex:0 0 auto;object-fit:contain}.school-name{display:grid;gap:2px;min-width:0;margin-right:auto;text-shadow:0 1px 2px oklch(.25 .08 28 / .28)}.school-name span{font-size:.95rem;font-weight:950}.school-name strong{font-size:.98rem;font-weight:900;line-height:1.2;text-wrap:balance}.class-mark{display:grid;justify-items:end;gap:3px;text-align:right;text-shadow:0 1px 2px oklch(.25 .08 28 / .28)}.class-mark span{font-size:1.34rem;font-weight:950}.class-mark strong{font-size:.86rem;font-weight:900}.topbar strong{display:block;font-size:1.2rem;text-wrap:balance}.topbar>div:first-child{min-width:0}.date-label{margin:0 0 4px;color:var(--muted);font-size:.92rem}.stats-pill{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 14px;color:var(--flower);background:#fff2ec;background:oklch(.97 .03 45);border-radius:999px;font-weight:800;white-space:nowrap}.lesson-switcher{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:-4px 0 16px}.lesson-switcher button,.review-picker{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;color:var(--primary-strong);background:#d3f1fe;border:1px solid oklch(.88 .04 225);border-radius:14px;font-weight:900}.lesson-switcher button.active{color:#fff;background:var(--primary)}.lesson-switcher button:disabled{opacity:.58}.review-picker{grid-column:1 / -1;justify-content:flex-start;padding:0 12px;overflow:hidden}.review-picker select{width:100%;min-width:0;min-height:48px;color:var(--primary-strong);background:transparent;border:0;outline:0;font:inherit;font-weight:900}.identify-panel{display:grid;justify-items:center;gap:16px;padding:34px 20px;text-align:center}.identify-panel h1{margin:0;font-size:2rem}.identify-panel p{max-width:28rem;margin:0;color:var(--muted);line-height:1.6}.identify-form{display:grid;width:min(100%,420px);gap:12px}.identify-form input{width:100%;min-height:58px;padding:0 18px;border:2px solid var(--border);border-radius:14px;color:var(--ink);font-size:1.2rem}.identify-form input:focus{border-color:var(--primary);outline:3px solid oklch(.82 .09 225 / .45)}.identify-form button,.finish-button{min-height:58px;border-radius:14px;color:#fff;background:var(--primary);font-weight:900}.study-area{display:grid;gap:14px}.progress-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;font-weight:800}.progress-track{height:10px;overflow:hidden;background:#cde2eb;border-radius:999px}.progress-track div{height:100%;background:var(--success);border-radius:inherit;transition:width .18s ease-out}.auto-toggle{display:inline-flex;align-items:center;gap:6px;color:var(--muted);font-size:.92rem;white-space:nowrap}.study-card{display:grid;justify-items:center;gap:16px;min-height:min(58svh,540px);padding:26px 18px;text-align:center;box-shadow:var(--shadow)}.study-card img{width:min(100%,360px);height:clamp(160px,28svh,230px);object-fit:contain}.study-text{width:100%;margin:auto 0 0;color:var(--ink);line-height:1.05;letter-spacing:0;overflow-wrap:anywhere;text-wrap:balance}.study-text.word{font-weight:950}.study-text.sentence{font-weight:850;line-height:1.16}.hint{margin:0;color:var(--muted);font-size:1.12rem;font-weight:750}.primary-actions{display:grid;grid-template-columns:1fr;gap:12px;width:100%;max-width:360px}.round-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:66px;padding:0 14px;color:#fff;background:var(--primary);border-radius:16px;font-size:1.08rem;font-weight:900}.round-action.recording{background:var(--flower)}.round-action.muted{color:var(--muted);background:#ddeaf2}.soft-message{max-width:34rem;margin:0;color:var(--muted);line-height:1.5}.recording-panel{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.recording-panel button,.listen-mine,.page-nav button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 14px;color:var(--primary-strong);background:#d3f1fe;border-radius:12px;font-weight:850}.listen-mine{color:#005e28;color:oklch(.42 .14 150);background:#d5f5da}.page-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.page-nav button{min-height:54px}.page-nav svg,.round-action svg,.finish-button svg,.mini-action svg,.share-copy-button svg,.lesson-switcher button svg{flex:0 0 auto}.finish-panel{min-height:72px;padding:14px;text-align:center}.finish-panel p{margin:0;color:var(--muted);line-height:1.5}.finish-cta{display:grid;justify-items:center;gap:10px}.finish-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;max-width:420px;font-size:1.08rem}.reward{position:relative;display:grid;justify-items:center;gap:10px;min-height:336px;padding:28px 18px 26px;overflow:hidden;color:var(--school-red);background:radial-gradient(circle at 20% 24%,oklch(.95 .11 100 / .95) 0 28px,transparent 29px),radial-gradient(circle at 82% 18%,oklch(.93 .15 36 / .92) 0 22px,transparent 23px),radial-gradient(circle at 74% 82%,oklch(.89 .12 82 / .95) 0 18px,transparent 19px),radial-gradient(circle at 16% 18%,oklch(.9 .12 92) 0 16px,transparent 17px),radial-gradient(circle at 88% 76%,oklch(.86 .14 25) 0 20px,transparent 21px),linear-gradient(180deg,#fffbf7,#ffe5db);background:radial-gradient(circle at 20% 24%,oklch(.95 .11 100 / .95) 0 28px,transparent 29px),radial-gradient(circle at 82% 18%,oklch(.93 .15 36 / .92) 0 22px,transparent 23px),radial-gradient(circle at 74% 82%,oklch(.89 .12 82 / .95) 0 18px,transparent 19px),radial-gradient(circle at 16% 18%,oklch(.9 .12 92) 0 16px,transparent 17px),radial-gradient(circle at 88% 76%,oklch(.86 .14 25) 0 20px,transparent 21px),linear-gradient(180deg,color(xyz 0.961 0.979 0.962),color(xyz 0.86 0.814 0.652));border:2px solid oklch(.94 .08 48);border-radius:16px;box-shadow:0 16px 36px #b478682e,inset 0 0 0 1px #ffffff73}.reward:before,.reward:after{position:absolute;color:#f6ba00;color:oklch(.82 .18 85);font-size:3rem;font-weight:950;content:"★"}.reward:before{top:18px;left:18px}.reward:after{right:22px;bottom:18px;color:#f87b5c}.reward>*{position:relative;z-index:1}.reward img{width:98px;height:auto;margin-bottom:-4px;filter:drop-shadow(0 6px 10px oklch(.7 .09 40 / .18))}.reward-badge{min-height:42px;padding:8px 18px;color:#281a00;color:oklch(.23 .05 80);background:linear-gradient(180deg,#fff0a6,#f4d576);background:linear-gradient(180deg,color(xyz 0.791 0.863 0.421),#f4d576);border-radius:999px;font-size:1.1rem;font-weight:950;box-shadow:0 10px 18px #eac6733d}.reward h2{margin:0;color:#620a09;font-size:1.78rem;line-height:1.2;text-wrap:balance}.reward p{color:#65321e;max-width:26rem;margin:0;font-size:1.12rem;font-weight:850;line-height:1.65}.reward strong{color:#d0020f;font-size:1.22rem;font-weight:950}.share-copy-button,.mini-action{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 14px;color:var(--primary-strong);background:#d3f1fe;border-radius:12px;font-weight:850}.share-copy-button{min-height:50px;color:#fff;background:linear-gradient(135deg,var(--school-red),var(--school-coral))}.mini-action.active{color:#fff;background:var(--primary)}.share-panel,.calendar-panel{display:grid;gap:14px;padding:16px;box-shadow:var(--shadow)}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.section-title p{margin:0 0 4px;color:var(--muted);font-size:.92rem}.section-title strong{display:block;line-height:1.3}.share-copy-card{padding:16px;color:#12304a;background:linear-gradient(180deg,#f0fdff,#daf3fe);background:linear-gradient(180deg,color(xyz 0.888 0.961 1.124),#daf3fe);border-radius:14px}.share-copy-card p{margin:0;font-size:1.02rem;font-weight:800;line-height:1.8}.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.calendar-weekdays span{text-align:center;color:var(--muted);font-size:.92rem;font-weight:800}.calendar-day{display:grid;justify-items:center;align-content:center;gap:6px;min-height:72px;padding:10px 6px;color:var(--ink);background:#ebfaff;background:oklch(.975 .018 222);border:1px solid oklch(.91 .028 228);border-radius:12px}.calendar-day:disabled{opacity:1}.calendar-day span{font-size:1rem;font-weight:900}.calendar-day strong{min-height:24px;font-size:1.08rem}.calendar-day.checked{background:linear-gradient(180deg,#e4ffd7,#d4f1d4);border-color:#aad9ab}.calendar-day.editable{cursor:pointer;box-shadow:0 8px 18px #4c7c8f1f}.calendar-day.saving{opacity:.65}.calendar-tip{margin:0;color:var(--muted);font-size:.94rem;line-height:1.6}.history-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:18px;background:#001d2f73;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.history-card{display:grid;gap:14px;width:min(100%,520px);padding:24px 20px;color:var(--ink);background:radial-gradient(circle at 90% 10%,oklch(.95 .12 58 / .9) 0 18px,transparent 19px),linear-gradient(180deg,#fff,#e6f9ff);background:radial-gradient(circle at 90% 10%,oklch(.95 .12 58 / .9) 0 18px,transparent 19px),linear-gradient(180deg,#fff,color(xyz 0.84 0.92 1.108));border:1px solid oklch(.89 .04 230);border-radius:18px;box-shadow:0 24px 46px #07172738}.history-badge{justify-self:start;min-height:34px;padding:7px 12px;color:var(--school-red);background:#fff2ec;background:oklch(.97 .07 42);border-radius:999px;font-size:.92rem;font-weight:900}.history-card h2{margin:0;font-size:1.65rem;line-height:1.2}.history-card p{margin:0;color:var(--muted);line-height:1.65}.history-quick-picks{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.history-quick-picks button,.history-save{min-height:50px;border-radius:14px;font-weight:900}.history-quick-picks button{color:var(--primary-strong);background:#d9f4ff;background:oklch(.95 .035 225)}.history-quick-picks button.active{color:#fff;background:linear-gradient(135deg,var(--primary),oklch(.56 .19 200))}.history-field{display:grid;gap:8px;text-align:left;font-weight:800}.history-field input{min-height:54px;padding:0 14px;border:2px solid var(--border);border-radius:14px;font-size:1.2rem}.history-save{color:#fff;background:linear-gradient(135deg,var(--school-red),var(--school-coral))}.toast{position:fixed;right:16px;bottom:16px;left:16px;max-width:560px;margin:0 auto;padding:14px 16px;color:#fff;background:#0e2a45;border-radius:14px;box-shadow:0 8px 20px #07172738;line-height:1.5}.mode-switch{display:inline-flex;gap:8px;margin-bottom:14px;padding:4px;background:#e1f2f9;border-radius:999px}.mode-switch button{min-height:38px;padding:0 14px;color:var(--muted);background:transparent;border-radius:999px;font-weight:800}.mode-switch button.active{color:#fff;background:var(--primary)}.admin-shell{display:grid;gap:18px;padding-bottom:24px}.admin-hero,.admin-section{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}.admin-hero{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding:18px}.admin-hero p{margin:0 0 6px;color:var(--muted)}.admin-hero h1,.admin-section h2{margin:0}.token-form,.admin-grid{display:grid;gap:10px}.admin-auth{display:grid;gap:10px;width:min(100%,420px)}.token-form input,.admin-grid input,.admin-grid select,.admin-grid textarea{min-height:46px;padding:0 12px;border:2px solid var(--border);border-radius:12px}.token-form button,.admin-grid button{min-height:46px;color:#fff;background:var(--primary);border-radius:12px;font-weight:900}.admin-section{padding:18px}.admin-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.admin-table{display:grid;gap:8px}.admin-row{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center;padding:10px 12px;background:#f2fafe;border-radius:12px}.admin-summary-row{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-student-row{grid-template-columns:.8fr 1fr 1fr 1fr .9fr}.admin-lesson-row,.admin-checkin-row{grid-template-columns:1fr 1.4fr .8fr .9fr}.admin-row span{min-width:0;overflow-wrap:anywhere}.admin-row-head{color:var(--muted);font-weight:900}.admin-error{padding:12px 14px;color:#fff;background:#d33a3c;border-radius:12px}@media(max-width:520px){.shell{padding:max(10px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.topbar{align-items:flex-start;min-height:54px}.topbar strong{font-size:1.04rem}.date-label{font-size:.84rem}.stats-pill{min-height:36px;padding:0 10px;font-size:.9rem}.brand-strip{display:grid;grid-template-columns:auto minmax(0,1fr);min-height:0;padding:10px}.brand-strip img{width:48px;grid-row:span 2}.school-name span{font-size:.78rem}.school-name strong{font-size:.82rem}.school-name{margin-right:0}.class-mark span{font-size:1rem}.class-mark{grid-column:2;justify-items:start;max-width:none;text-align:left}.class-mark strong{font-size:.72rem}.primary-actions{grid-template-columns:1fr}.lesson-switcher{gap:8px}.lesson-switcher button,.review-picker{min-height:46px;border-radius:12px;font-size:.95rem}.progress-row{grid-template-columns:auto 1fr}.auto-toggle{grid-column:1 / -1;justify-self:end}.admin-row{grid-template-columns:1fr}.admin-row-head{display:none}.admin-row:not(.admin-row-head){gap:8px;padding:12px}.admin-row:not(.admin-row-head) span{display:flex;justify-content:space-between;gap:12px;line-height:1.35}.admin-row:not(.admin-row-head) span:before{content:attr(data-label);flex:0 0 auto;color:var(--muted);font-weight:850}.page-nav{grid-template-columns:1fr 1fr;gap:8px}.page-nav button{padding:0 8px;font-size:.95rem;gap:4px}.page-nav button:last-child{grid-column:1 / -1}.section-title{display:grid}.history-quick-picks{grid-template-columns:1fr 1fr}}@media(max-width:430px){.loading-card,.identify-panel,.study-card,.finish-panel,.share-panel,.calendar-panel,.admin-hero,.admin-section{border-radius:12px}.brand-strip{align-items:center;gap:8px}.brand-strip img{width:42px}.school-name strong{font-size:.78rem}.class-mark span{font-size:.92rem}.class-mark strong{font-size:.66rem}.identify-panel{gap:12px;padding:26px 14px}.loading-card{padding:26px 16px}.loading-date{font-size:.86rem}.loading-title{font-size:1.42rem}.loading-note{font-size:.96rem;line-height:1.65}.identify-panel h1{font-size:1.65rem}.identify-form input,.identify-form button,.finish-button{min-height:52px}.study-area{gap:10px}.study-card{gap:12px;min-height:min(54svh,460px);padding:18px 12px}.study-card img{width:min(100%,300px);height:clamp(140px,26svh,190px)}.hint{font-size:.96rem}.round-action{min-height:58px;border-radius:14px}.finish-panel{padding:12px}.reward{min-height:0;padding:22px 12px}.reward img{width:76px}.reward-badge{min-height:38px;padding:7px 12px;font-size:.96rem}.reward h2{font-size:1.42rem}.reward p,.share-copy-card p{font-size:.94rem;line-height:1.65}.calendar-panel{gap:10px;padding:12px}.calendar-weekdays,.calendar-grid{gap:5px}.calendar-day{min-height:48px;gap:2px;padding:6px 2px;border-radius:8px}.calendar-day span{font-size:.86rem}.calendar-day strong{min-height:18px;font-size:.86rem}.section-title{gap:10px}.mini-action{width:100%}.admin-shell{gap:12px}.admin-hero,.admin-section{padding:14px}.admin-hero h1{font-size:1.35rem;line-height:1.25}.admin-section-head{display:grid;gap:8px}.admin-grid{grid-template-columns:1fr}.token-form input,.admin-grid input,.admin-grid select,.admin-grid textarea,.token-form button,.admin-grid button{min-height:44px}}@media(max-width:360px){.calendar-weekdays,.calendar-grid{gap:3px}.calendar-day{min-height:44px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}.loading-dots i{animation:none}}@keyframes loadingPulse{0%,to{opacity:.35;transform:translateY(0)}45%{opacity:1;transform:translateY(-3px)}}
