@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap');
:root{font-family:'Be Vietnam Pro',Arial,sans-serif;color:#243d37;background:#f6f8f7;font-size:16px;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #cf7133;outline-offset:4px}button{transition:background .15s,transform .15s}button:hover{filter:brightness(.96)}a{color:inherit}.sidebar{width:252px;position:fixed;inset:0 auto 0 0;background:#fff;border-right:1px solid #e4eae7;padding:35px 24px;display:flex;flex-direction:column}.brand{text-decoration:none;display:flex;gap:13px;align-items:center;font-size:20px;line-height:1.35;letter-spacing:-.5px}.mark{display:grid;place-items:center;width:48px;height:52px;border-radius:16px;background:#24594c;color:#ecddab;font-size:36px}.side-label{font-size:12px;letter-spacing:1px;color:#74817b;margin:56px 10px 17px}nav{display:grid;gap:8px}nav button{border:0;background:transparent;padding:15px 11px;text-align:left;border-radius:10px;color:#65726d;font-size:14px;font-weight:500;display:flex;gap:12px;align-items:center}nav button span{font-size:21px;width:25px;text-align:center}nav button.active{background:#eaf3ee;color:#24594c;font-weight:700}.side-bottom{margin-top:auto;padding:40px 10px 0;font-size:14px}.side-bottom strong{font-size:18px;line-height:1.6}.side-bottom p{line-height:1.8;color:#718077}.small-star{font-size:40px;color:#b67b38;margin-bottom:12px}.prototype{font-size:10px;letter-spacing:1px;display:block;margin-top:27px;color:#77847e}.app{margin-left:252px}header{height:86px;background:#fff;border-bottom:1px solid #e4eae7;padding:0 46px;display:flex;align-items:center;justify-content:space-between;font-size:14px;color:#65766d}header>div{display:flex;gap:22px;align-items:center}.font-button{border:1px solid #dce4df;border-radius:9px;background:white;padding:7px 11px;font-weight:700;color:#36574b}.font-button span{font-size:13px}main{max-width:1400px;margin:auto;padding:44px 46px 20px}.eyebrow{font-size:11px;letter-spacing:1.5px;font-weight:600;color:#71817a}h1{font-size:34px;letter-spacing:-1.3px;font-weight:600;margin:12px 0}p{line-height:1.7}.heading{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:30px}.heading p{color:#758179;margin:0;font-size:15px}.session-tag{font-size:12px;border:1px solid #dae4dc;border-radius:30px;padding:11px 14px;color:#567261;white-space:nowrap}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 272px;gap:26px}.card{background:white;border:1px solid #dfe7e1;border-radius:20px;overflow:hidden;box-shadow:0 5px 20px #163b2810}.card-top{padding:22px 28px;border-bottom:1px solid #edf0ed;display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#78867d}.topic{color:#3c6956;background:#edf5ef;border-radius:6px;padding:6px 10px;font-size:12px}.question{padding:34px 32px 30px}.question-label{color:#72847a;font-size:12px;font-weight:600;letter-spacing:1px}.question h2{font-size:29px;line-height:1.5;letter-spacing:-.6px;font-weight:600;color:#203d32;margin:16px 0 10px}.translation{font-size:17px;color:#79847d;margin-top:0}.audio-row{display:flex;gap:10px;flex-wrap:wrap;margin:26px 0}.primary,.secondary,.subtle{border-radius:10px;padding:14px 19px;border:1px solid #d7e3db;font-size:14px;font-weight:600;min-height:48px}.primary{color:#fff;background:#24594c;border-color:#24594c}.secondary{background:#fff;color:#315d4c}.subtle{color:#5c7167;background:#f4f7f4;border-color:transparent}.answer{background:#f0f6f1;border:1px solid #dce9de;border-radius:12px;padding:22px;margin-top:14px}.answer .question-label{color:#5a7868}.answer h3{font-size:25px;margin:12px 0 4px;font-weight:600}.answer p{margin:0;color:#61796a;font-size:15px}.answer button{margin-top:16px}.reveal{width:100%;border-style:dashed;background:#f6f9f6;padding:25px;color:#4c715c}.tip{display:flex;gap:12px;font-size:13px;color:#7a8174;padding:18px 0 0;line-height:1.8}.tip span{color:#ae833e;font-size:19px}.card-actions{display:flex;justify-content:space-between;padding:20px 30px;background:#fbfcfb;border-top:1px solid #e8eee8;gap:8px;flex-wrap:wrap}.below-card{display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:13px;color:#7b877e}.below-card button{border:0;background:transparent;color:#51745f;padding:10px}.right section{border:1px solid #e0e7df;border-radius:16px;padding:25px}.daily{background:#ecf2e9}.daily .eyebrow{font-size:10px;letter-spacing:1px;color:#65815f}.progress-number{display:flex;align-items:baseline;gap:7px;margin:22px 0 17px}.progress-number strong{font-size:40px;line-height:1;font-weight:600}.progress-number span{font-size:13px;color:#70806c}progress{height:7px;width:100%;border:0;border-radius:5px;overflow:hidden;background:#d6e1d1}progress::-webkit-progress-bar{background:#d6e1d1}progress::-webkit-progress-value{background:#426e4d}progress::-moz-progress-bar{background:#426e4d}.daily p{font-size:13px;color:#6c8066}.daily-foot{border-top:1px solid #d6e1d1;padding-top:17px;font-size:12px;color:#6f7f68}.steps{margin-top:20px;background:white}.steps h2{font-size:16px;margin:0 0 20px}.steps>div{display:flex;gap:12px;margin-top:17px}.steps>div>span{border:1px solid #dbe4dc;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;flex-shrink:0;font-size:12px;color:#628068}.steps p{margin:0;color:#7a877e;font-size:12px;line-height:1.9}.steps b{font-size:13px;font-weight:500;color:#455e4d}.guide-link{width:100%;display:flex;justify-content:space-between;border:0;background:none;text-align:left;padding:22px 6px;color:#597563;font-size:13px}.guide-link span{font-size:18px}footer{margin-top:34px;color:#8a948d;font-size:11px;line-height:1.8}footer a{color:#647b6a;margin-left:5px}.guide-content{padding:28px}.guide-content h2{font-size:22px}.guide-content h3{font-size:17px;margin-top:26px}.guide-content p,.guide-content li{font-size:15px;line-height:1.8}.guide-content a{color:#24594c}.badge{display:inline-block;background:#f7eddc;padding:6px 10px;font-size:12px;border-radius:6px;color:#8e672c}.result{padding:35px;text-align:center}.result strong{display:block;font-size:52px;color:#24594c;margin:25px}.result p{color:#65786b}.font-large{font-size:20px}.font-large .question h2{font-size:2rem}.font-large .translation,.font-large .answer p{font-size:1.1rem}.font-large button{font-size:1rem}#status:not(:empty){position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#244c3e;color:white;padding:15px 23px;border-radius:12px;max-width:90vw;font-size:14px;box-shadow:0 5px 20px #0002;z-index:10}button:disabled{cursor:default;opacity:.5}@media(min-width:1450px){main{padding-top:60px}.question{padding:42px}.question h2{font-size:34px}}@media(max-width:1120px){.sidebar{width:218px;padding:30px 18px}.app{margin-left:218px}main{padding:30px 25px}.workspace{grid-template-columns:minmax(0,1fr) 230px;gap:18px}.session-tag{display:none}header{padding:0 25px}.question{padding:25px}.right section{padding:20px}.card-actions{padding:18px}.question h2{font-size:25px}}@media(max-width:850px){.workspace{grid-template-columns:1fr}.right{display:grid;grid-template-columns:1fr 1fr;gap:16px}.steps{margin:0}.guide-link{grid-column:1/-1;padding-top:0}.side-bottom{display:none}.sidebar{width:200px}.app{margin-left:200px}}@media(max-width:620px){.sidebar{position:static;width:auto;padding:18px;border-right:0;border-bottom:1px solid #e4eae7}.brand{font-size:16px}.mark{height:40px;width:40px;font-size:28px}.brand br{display:none}.brand b{margin-left:4px}.side-label{display:none}nav{display:grid;grid-template-columns:repeat(4,1fr);margin-top:20px;gap:4px}nav button{font-size:11px;text-align:center;padding:10px 3px;display:flex;flex-direction:column;gap:4px}nav button span{font-size:19px}.app{margin:0}header{height:56px;padding:0 20px}.language{font-size:11px}main{padding:28px 17px}h1{font-size:28px}.heading{margin-bottom:24px}.heading p{font-size:13px}.eyebrow{font-size:10px}.card-top{padding:18px}.question{padding:24px 20px}.question h2{font-size:25px}.translation{font-size:15px}.card-actions{padding:16px}.primary,.secondary,.subtle{padding:12px 14px}.right{grid-template-columns:1fr}.steps{display:none}.guide-link{padding:3px 0}.daily{margin-top:5px}.below-card{font-size:12px}footer{font-size:11px}.font-large nav button{font-size:13px}}
