@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap');
:root{--green:#146653;--ink:#203c35;--muted:#76877f;--line:#e3eae5}*{box-sizing:border-box}body{margin:0;background:#f6f8f5;color:var(--ink);font:15px 'Noto Sans Thai',sans-serif}button,input,select,textarea{font:inherit}button,a,input,select,textarea{outline-offset:4px}button{cursor:pointer}a{color:var(--green)}aside{position:fixed;width:246px;height:100vh;padding:33px 23px;background:#fff;border-right:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;font-size:20px;text-decoration:none;font-weight:700;white-space:nowrap}.brand b{background:var(--green);color:white;border-radius:10px;padding:4px 12px}.brand em{font-size:12px;color:var(--green);font-style:normal}aside small{display:block;color:var(--muted);margin:20px 0 30px}nav a{display:block;padding:13px 15px;text-decoration:none;color:#6a7a73;border-radius:9px;margin:7px 0}nav a.active{background:#e8f3ed;color:var(--green);font-weight:600}.sidefoot{position:absolute;bottom:28px;font-size:12px;line-height:2}.sidefoot span{color:var(--muted)}main{margin-left:246px;padding:0 42px;max-width:1600px}header{height:88px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:13px;color:var(--muted)}.avatar{color:var(--ink)}h1{font-size:30px;margin:8px 0 10px;letter-spacing:-.6px}h2{font-size:21px;margin:0 0 12px}h3{font-size:17px;margin:10px 0}p{line-height:1.8}.muted,small{color:var(--muted)}.eyebrow{font-size:12px;letter-spacing:1.8px;color:var(--green);font-weight:600}.pagehead{padding:32px 0 20px}.hero{background:#e6efe5;border-radius:18px;padding:30px 34px;display:flex;justify-content:space-between;gap:25px;position:relative;overflow:hidden}.hero h2{font-size:29px;line-height:1.5}.hero p{color:#567164;margin:10px 0 22px}.hero-art{min-width:200px;display:grid;place-content:center;font-size:78px;transform:rotate(-8deg);opacity:.85}.btn,button.primary{border:0;background:var(--green);color:#fff;border-radius:8px;padding:12px 20px;text-decoration:none;display:inline-block;font-weight:500}.secondary,button{border:1px solid var(--line);background:white;color:var(--ink);border-radius:8px;padding:10px 15px}.btn:hover,button:hover{filter:brightness(.96)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:24px 0}.stat,.card,.panel{background:white;border:1px solid var(--line);border-radius:13px;padding:21px}.stat strong{font-size:27px;display:block;margin:6px 0}.stat small{font-size:12px}.sectionline{display:flex;align-items:center;justify-content:space-between;margin:30px 0 18px}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:17px}.card{position:relative;display:flex;flex-direction:column;gap:9px}.card p{font-size:13px;color:var(--muted);margin:0}.card .icon{font-size:24px;background:#eef3e9;border-radius:11px;width:48px;height:48px;display:grid;place-content:center}.card button{margin-top:12px;align-self:flex-start}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.between{justify-content:space-between}.tag{font-size:11px;background:#edf5ef;padding:4px 8px;border-radius:6px;color:var(--green)}.notice{background:#fff7e5;border:1px solid #f1e1ba;border-radius:10px;padding:15px;font-size:13px;line-height:1.8;margin:20px 0}.filters{display:flex;flex-wrap:wrap;gap:12px;margin:15px 0 22px}input,select,textarea{border:1px solid #cfdbd2;background:white;padding:11px;border-radius:8px;max-width:100%;color:var(--ink)}input[type=search]{flex:1;min-width:180px}label{display:block;margin:10px 0;font-size:13px}label input,label textarea,label select{display:block;width:100%;margin-top:7px}textarea{min-height:90px}.progress{height:7px;background:#e7ede7;border-radius:10px;overflow:hidden;margin:18px 0}.progress div{height:100%;background:var(--green)}.option{display:flex;text-align:left;align-items:center;gap:15px;width:100%;margin:12px 0;padding:16px}.option b{border:1px solid #d5dfd7;border-radius:7px;padding:4px 10px}.option.selected{border-color:var(--green);background:#eff7f1}.correct{background:#e4f5e8!important;border-color:#58a46c!important}.wrong{background:#fff0ed!important;border-color:#d98b7a!important}.explain{padding:16px;border-radius:10px;background:#edf5ef;line-height:1.9;margin:18px 0}.qnav{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.qnav button{padding:6px 12px}.qnav .answered{background:#e3efe6}.qnav .current{border-color:var(--green)}.quiz{max-width:860px;margin:28px auto}.timer{font-size:20px;font-weight:600}.empty{padding:45px;text-align:center;border:1px dashed #cbd9ce;border-radius:13px;background:#fff}.history{border-bottom:1px solid var(--line);padding:17px 0}.review{border-bottom:1px solid var(--line);padding:20px 0}.bar{height:10px;background:#dcece1;border-radius:5px}.bar i{height:100%;display:block;background:var(--green);border-radius:5px}footer{font-size:11px;color:var(--muted);padding:35px 0}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#244a3f;color:white;padding:13px 24px;border-radius:8px;display:none;z-index:4}.adminlist{max-height:450px;overflow:auto}.adminitem{padding:15px 0;border-bottom:1px solid var(--line)}.adminitem p{margin:5px 0}details{margin:15px 0}.score{font-size:60px;font-weight:700;color:var(--green)}@media(min-width:1200px){.grid.four{grid-template-columns:repeat(4,1fr)}.card h3{min-height:52px}}@media(max-width:900px){aside{width:195px;padding:25px 12px}.brand{font-size:16px}main{margin-left:195px;padding:0 22px}.hero-art{display:none}.stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){aside{position:static;width:100%;height:auto;padding:16px;border-bottom:1px solid var(--line)}aside small,.sidefoot{display:none}nav{display:flex;overflow:auto;gap:5px;margin-top:13px}nav a{white-space:nowrap;font-size:12px;padding:9px;margin:0}.brand{font-size:20px}main{margin:0;padding:0 17px}header{height:54px;font-size:10px}h1{font-size:25px}.hero{padding:24px}.hero h2{font-size:23px}.grid{grid-template-columns:1fr}.stats{gap:10px}.stat{padding:15px}.pagehead{padding-top:24px}.panel{padding:17px}.filters>*{width:100%}.row button{flex-grow:1}.quiz h2{font-size:19px}}

.explanation-text{white-space:pre-line}.blueprint{margin:0 0 22px}.blueprint>small{display:block;margin-top:18px;line-height:1.8}.blueprint .card{background:#f8faf7}.blueprint .card h3{min-height:0}

.brand{white-space:normal;font-size:18px;line-height:1.5}.brand em{font-size:12px}.avatar{display:flex;gap:8px;align-items:center}.avatar button{padding:8px 11px;font-size:12px}.member-overlay{position:fixed;inset:0;background:#153f3299;z-index:20;display:flex;align-items:center;justify-content:center;padding:20px}.member-panel{max-width:460px;width:100%;max-height:95vh;overflow:auto}.member-panel small{line-height:1.8;display:block}#memberError{color:#a83a31}.member-panel form button{width:100%}@media(max-width:620px){header{height:auto;min-height:64px;gap:10px;flex-wrap:wrap;padding:10px 0}.avatar{flex-wrap:wrap}.brand{font-size:20px}}

.home-photo{width:44%;flex-shrink:0;align-self:stretch;min-height:380px}.home-photo img{display:block;width:100%;height:100%;max-height:580px;object-fit:cover;object-position:center 38%;border-radius:15px}.hero{align-items:center}.hero>div:first-child{flex:1}.grid.four{grid-template-columns:1fr}.grid.four .card h3{min-height:0}.blueprint .grid{grid-template-columns:1fr}@media(max-width:620px){nav{display:grid;grid-template-columns:1fr;overflow:visible;gap:6px}nav a{white-space:normal;padding:12px 15px;font-size:14px}.hero{flex-direction:column-reverse;gap:22px;padding:18px}.home-photo{width:100%;height:410px;min-height:0}.hero>div:first-child{width:100%}.home-photo img{max-height:none}.grid{grid-template-columns:1fr}}
:root{--green:#a62666;--ink:#542b40;--muted:#896878;--line:#f0d8e5}body{background:#fff5fa}aside{background:#fffafd}nav a{color:#8b5872}nav a.active{background:#fce0ee;color:#96205b}.hero{background:linear-gradient(135deg,#ffe3f0,#fbd2e6)}.hero p{color:#88566f}.card .icon,.tag,.explain,.blueprint .card{background:#fff0f7}.progress,.bar{background:#f6d6e6}.option.selected,.qnav .answered{background:#fce2ef}.option b,input,select,textarea{border-color:#e6c1d4}.notice{background:#fff0f7;border-color:#ebc5d9}#toast{background:#873052}.member-overlay{background:#6f244f99}.empty{border-color:#e8bdd2}.stat,.card,.panel{box-shadow:0 5px 22px #a6266606}

.mixed-panel{background:#fff0f7;border-color:#e8b1cd;margin:22px 0}.mixed-panel h2{margin-top:12px}.mixed-panel label{max-width:380px}.mixed-panel>p{margin:10px 0}

.study-intro{background:linear-gradient(135deg,#ffe3f0,#fff8fc);margin-bottom:22px}.lesson-grid{margin:22px 0}.lesson-grid .card h3{min-height:0}.lesson-reader{max-width:880px;margin:24px auto}.lesson-section{margin:20px 0}.lesson-section h2{margin-top:10px}.lesson-section p{font-size:16px;line-height:2}.flashcard summary,.image-reference summary{cursor:pointer;line-height:1.9}.flashcard p{border-top:1px solid var(--line);padding-top:15px}.image-reference img{width:100%;max-width:700px;height:auto;display:block;margin:15px auto;border-radius:10px}.memory-box{border-left:5px solid #c24885;background:#fff0f7}.lesson-actions{margin:25px 0}.lesson-actions button{white-space:normal}.lesson-reader .pagehead h1{line-height:1.6}@media(max-width:620px){.lesson-grid{grid-template-columns:1fr}.lesson-section p{font-size:15px}.lesson-actions button{width:100%}}