@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700&family=Noto+Serif+JP:wght@400;500;600;700&display=swap');
:root{--green:#285c4c;--ink:#263f36;--muted:#869088;--paper:#f8f9f5;--line:#e4e9df;--light:#edf2e9;--orange:#c58248;--serif:'Noto Serif JP','Yu Mincho',serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'Noto Sans SC','Microsoft YaHei',sans-serif}button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #d2a363;outline-offset:3px}a{color:inherit;text-decoration:none}button{border:0;background:none;color:inherit}h1,h2,h3,p{margin:0}h1{font-size:30px;letter-spacing:1px;font-weight:600}h2{font-size:20px;font-weight:600}h3{font-size:16px}p{line-height:1.9}.sidebar{width:230px;background:#fffefa;position:fixed;inset:0 auto 0 0;border-right:1px solid var(--line);padding:35px 24px;display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;font-size:21px;font-weight:600;letter-spacing:2px}.brandmark{background:var(--green);color:#f8f4de;border-radius:12px 12px 4px 12px;width:44px;height:47px;display:grid;place-items:center;font:27px var(--serif)}.brand small{display:block;font:9px var(--serif);letter-spacing:.8px;color:var(--muted);margin-top:6px}.navcaption{font-size:10px;letter-spacing:2px;color:#9ba396;margin:49px 12px 16px}nav{display:flex;flex-direction:column;gap:7px}nav button{display:flex;align-items:center;gap:13px;text-align:left;padding:13px 15px;border-radius:8px;color:#7c887f;font-size:13px}nav button.active{color:var(--green);background:#eaf0e6;font-weight:600}nav button.active:after{content:'';width:5px;height:5px;background:var(--green);border-radius:50%;margin-left:auto}.ico{width:19px;height:19px;stroke:currentColor;stroke-width:1.6;fill:none;flex-shrink:0}.navbadge{font-size:10px;background:#e6ebe2;border-radius:5px;padding:2px 6px;margin-left:auto}.sidebottom{margin-top:auto;padding:30px 12px 0}.leaf{font-size:27px;color:#a4b38c;display:block;margin-bottom:14px}.sidebottom b{font-size:12px;font-weight:500}.sidebottom p{font-size:11px;color:#9ba396;margin-top:9px;line-height:2}.sidecredit{border-top:1px solid var(--line);font-size:9px;color:#a2aa9e;margin-top:25px;padding-top:19px;white-space:nowrap}.shell{margin-left:230px}header{height:80px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 42px;background:#fbfcf8}#breadcrumb{font-size:11px;color:#809082}#breadcrumb span{padding:0 13px;color:#bdc5b9}.header-actions{display:flex;align-items:center;gap:24px}.subtle{font-size:11px;color:#83917e}.avatar{background:#e9eddf;color:#637b58;width:31px;height:31px;border:4px solid #f1f3eb;border-radius:50%;display:grid;place-items:center;font-size:11px}main{max-width:1270px;margin:auto;padding:37px 42px 20px;min-height:calc(100vh - 140px)}.eyebrow{font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#9aa48f;margin-bottom:10px}.pageintro{display:flex;align-items:end;justify-content:space-between;margin-bottom:27px}.subtitle{font-size:12px;color:#8a9489;margin-top:11px}.date{font:11px var(--serif);color:#919b8a}.greeting-title{font-family:var(--serif);font-size:29px;letter-spacing:2px}.greeting-title .wave{font-family:sans-serif;font-size:23px}.hero{background:#eaf0e2;border:1px solid #e3e9d9;border-radius:13px;min-height:263px;overflow:hidden;display:grid;grid-template-columns:1.05fr 1fr;position:relative}.herocopy{padding:31px 0 30px 32px;z-index:1}.pill{display:inline-flex;gap:6px;align-items:center;font-size:10px;border-radius:4px;background:#fcfdf6;color:#71845e;padding:5px 9px}.hero h2{font:30px/1.6 var(--serif);letter-spacing:2px;margin:14px 0 10px}.hero p{font-size:11px;color:#819173;line-height:1.9}.primary{background:var(--green);color:white;padding:12px 20px;border-radius:6px;display:inline-flex;gap:24px;align-items:center;font-size:12px;transition:.2s}.primary:hover{background:#204b3e;transform:translateY(-1px)}.hero .primary{margin-top:21px}.primary .ico{width:15px}.outline{border:1px solid #d7dfcf;background:#fffefa;border-radius:6px;padding:10px 16px;font-size:12px}.outline:hover{border-color:#8ca684;background:#f2f6ed}.town{width:100%;height:100%;min-height:260px;align-self:end}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin:21px 0 30px}.stat{border:1px solid var(--line);border-radius:9px;background:#fffefa;padding:18px 20px;display:flex;gap:15px;align-items:center}.stat-icon{display:grid;place-items:center;width:37px;height:37px;background:#f1f3eb;border-radius:9px;color:#8da075}.stat:nth-child(2) .stat-icon{background:#faf0e5;color:#bf956b}.stat:nth-child(3) .stat-icon{background:#edf1ef;color:#799a90}.stat strong{font-size:22px;font-weight:500;line-height:1.3}.stat strong small{font-size:10px;color:#9da796;font-weight:400;margin-left:5px}.stat label{font-size:10px;color:#969f91;display:block;margin-top:5px}.homecols{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,1fr);gap:25px}.sectionhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.sectionhead h2{font-size:16px}.sectionhead small{display:block;color:#a3aa9b;font-size:10px;font-weight:400;margin-top:5px;letter-spacing:.3px}.textlink{font-size:10px;color:#87957b;display:flex;align-items:center;gap:6px}.tasks{display:flex;flex-direction:column;gap:11px}.task{display:flex;align-items:center;gap:16px;padding:20px 21px;background:#fffefa;border:1px solid var(--line);border-radius:9px;text-align:left;width:100%;transition:transform .2s,border-color .2s}.task:hover{transform:translateY(-2px);border-color:#afc19f}.taskicon{font-family:var(--serif);font-size:22px;background:#f0f2e8;width:48px;height:48px;border-radius:9px;color:#83956d;display:grid;place-items:center}.task:nth-child(2) .taskicon{color:#bd9867;background:#faf3e7}.task:nth-child(3) .taskicon{color:#819e97;background:#eff3ef}.taskbody{flex:1}.task b{font-size:12px;font-weight:500;display:block;margin-bottom:7px}.task p{font-size:10px;color:#9da593}.task .duration{font-size:9px;color:#a8af9f;display:block;margin-top:6px}.task .arrow{color:#a0ad91;font-size:18px}.tag{display:inline-flex;align-items:center;font-size:9px;color:#879b70;background:#eff4e9;padding:3px 6px;border-radius:4px;margin-left:8px}.featurecard{border-radius:11px;border:1px solid var(--line);overflow:hidden;background:#fffefa}.featurevisual{height:121px;background:#f0ede3;position:relative;overflow:hidden;display:grid;place-items:center}.featurevisual svg{width:100%;height:100%}.featurebody{padding:17px 20px}.featurebody .eyebrow{font-size:9px;margin-bottom:7px}.featurebody h3{font-family:var(--serif);font-size:19px;font-weight:500;letter-spacing:1px}.featurebody p{font-size:10px;color:#929b87;margin-top:7px}.featurebody button{margin-top:13px;font-size:10px;color:#748b63}.quote{border:1px solid var(--line);border-radius:9px;margin-top:15px;padding:17px 20px;background:#f2f4eb;position:relative}.quote small{font-size:9px;color:#9aa48c}.quote p{font-family:var(--serif);font-size:15px;margin:8px 0 5px;letter-spacing:1px}.quote span{font-size:10px;color:#9aa48c}.quote button{position:absolute;right:15px;top:16px;color:#8e9e80}.journey{margin-top:30px}.journeymap{display:flex;border:1px solid var(--line);background:#fffefa;border-radius:10px;padding:20px 12px}.milestone{flex:1;position:relative;text-align:center;border-right:1px dashed #dbe2d2;padding:2px 4px}.milestone:last-child{border:0}.milestone span{font-size:9px;color:#a0aa93}.milestone b{display:block;font-size:11px;font-weight:500;margin:6px 0}.milestone small{font-size:9px;color:#a2ab98}.milestone:first-child b{color:#69864f}footer{max-width:1270px;margin:auto;padding:25px 42px;color:#a7ad9f;font-size:9px;display:flex;justify-content:space-between}footer button{font-size:9px;color:#8c997f}.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:22px 0}.chip{border:1px solid var(--line);border-radius:20px;background:#fffefa;padding:8px 14px;font-size:11px;color:#8b9585}.chip.active{background:var(--green);border-color:var(--green);color:#fff}.search{padding:11px 15px;background:#fffefa;border:1px solid var(--line);border-radius:7px;min-width:230px;flex:1;color:var(--ink)}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.card{background:#fffefa;border:1px solid var(--line);border-radius:10px;padding:23px}.lessoncard{display:flex;flex-direction:column;gap:12px}.lessoncard .topline{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#9aa58e}.lessoncard h3{font-size:16px}.lessoncard p{font-size:11px;color:#939e8a;line-height:1.8}.lessoncard .pattern{font-family:var(--serif);font-size:13px;color:#64805b;min-height:40px}.lessoncard button{margin-top:auto;align-self:start}.progressbar{height:5px;background:#e8eddf;border-radius:5px;overflow:hidden}.progressbar i{display:block;height:100%;background:#829e64;border-radius:5px}.stagehead{margin:30px 0 15px;display:flex;gap:15px;align-items:center}.stagehead span{font:22px var(--serif);color:#a1b18c}.stagehead p{font-size:11px;color:#95a087}.studygrid{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:24px}.panel{padding:28px;background:#fffefa;border:1px solid var(--line);border-radius:12px}.panel h2{margin-bottom:17px;font-size:18px}.panel p{color:#73836c;font-size:13px;line-height:2.1}.formula{background:#edf2e7;border-radius:8px;padding:25px;margin:16px 0 23px;font:23px/1.8 var(--serif);color:#3e6746}.example{border-left:3px solid #bac9a6;padding:5px 0 5px 18px;margin:21px 0;position:relative}.jp{font-family:var(--serif);font-size:22px;line-height:1.9;letter-spacing:.5px}.zh{font-size:12px;color:#91a084;margin-top:6px}.speak{border:1px solid #e2e8d9;border-radius:50%;height:31px;width:31px;display:inline-grid;place-items:center;font-size:14px;vertical-align:middle;color:#7c9568;margin-left:10px;background:#fcfdf8}.note{border-radius:8px;background:#f8f1e5;border:1px solid #eee4cf;padding:18px;margin-top:22px;color:#9a835d;font-size:12px;line-height:1.9}.note b{display:block;margin-bottom:6px;color:#97794f}.wordlist{display:flex;flex-direction:column;gap:0}.wordrow{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--line)}.wordrow:last-child{border-bottom:0}.wordrow .jp{font-size:19px}.wordrow small{font-size:10px;color:#9daa8d;display:block;margin-top:4px}ruby rt{font-size:9px;letter-spacing:0;color:#9aa78b}body.no-ruby ruby rt{visibility:hidden}.checklist{padding:0;margin:0;list-style:none}.checklist li{padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.8;color:#859579}.lessonnav{display:flex;justify-content:space-between;margin-top:25px;gap:12px}.quizoptions{display:grid;gap:10px;margin-top:22px}.option{padding:16px;border:1px solid #dce4d3;border-radius:8px;text-align:left;background:#fffefa;font-size:15px;line-height:1.8}.option:hover:not(:disabled){background:#eef4e7;border-color:#9db28c}.option:disabled{cursor:default}.option.correct{border-color:#7c9d6a;background:#edf5e6;color:#4d7541}.option.wrong{border-color:#cd9d85;background:#fbefe8;color:#aa694e}.feedback{margin-top:18px;padding:18px;border-radius:8px;background:#f0f4e8;font-size:13px;line-height:1.9}.feedback.bad{background:#fcf0e6}.feedback .primary{margin-top:15px}.muted{color:#93a085;font-size:12px}.empty{padding:55px 20px;text-align:center}.empty h2{margin:15px}.empty p{margin-bottom:23px;font-size:13px;color:#8a9b7c}.reviewwrap{max-width:650px;margin:24px auto}.flashcard{background:#fffefa;border:1px solid var(--line);border-radius:16px;min-height:310px;text-align:center;padding:39px 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 12px 35px #2d492b05}.flashcard .bigword{font:49px/1.7 var(--serif);margin:20px 0 8px}.flashcard .translation{font-size:23px;margin:13px;color:#5b754d}.flashcard .reading{font-family:var(--serif);font-size:20px;color:#879b73}.reviewactions{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.reviewactions button{border:1px solid var(--line);padding:15px 8px;border-radius:8px;background:#fffefa;font-size:13px}.reviewactions button:first-child{color:#ae795b;background:#fbf0e7}.reviewactions button:last-child{color:#55794e;background:#eaf2e3}.reviewactions small{display:block;font-size:10px;color:#97a18e;margin-top:7px}.wordcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.wordcard{padding:22px 17px;background:#fffefa;border:1px solid var(--line);border-radius:8px}.wordcard .jp{font-size:23px}.wordcard .wordmeta{display:flex;justify-content:space-between;margin-bottom:17px;color:#a0ab92;font-size:9px}.wordcard .speak{margin:0}.wordcard .outline{padding:5px 8px;font-size:10px;margin-top:14px}.wordcard p{font-size:12px;color:#91a080}.sceneicon{height:60px;width:60px;border-radius:16px;display:grid;place-items:center;font-size:31px;background:#eff1e6;margin-bottom:18px}.scenecard p{font-size:11px;color:#96a087;margin:9px 0 15px}.scenecard small{font-size:10px;color:#a5ae99;display:block;margin-bottom:17px}.chat{max-width:700px;margin:auto}.chat-bubble{border:1px solid var(--line);background:#fffefa;padding:22px 25px;border-radius:16px 16px 16px 3px;margin:16px 0}.chat-bubble.user{background:#e9f0e1;border-color:#dbe5cd;border-radius:16px 16px 3px 16px;margin-left:50px}.chat-bubble .jp{font-size:20px}.animes{display:grid;grid-template-columns:1fr 1fr;gap:18px}.animecard{padding:27px;background:#fffefa;border-radius:12px;border:1px solid var(--line)}.animecard .dramatic{font:26px var(--serif);margin:20px 0 13px}.animecard .daily{font:19px/1.8 var(--serif);color:#628257;background:#f0f4e9;border-radius:7px;padding:16px}.animecard p{font-size:12px;color:#8b9a7c;margin:15px 0}.kana-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;max-width:650px;margin:auto}.kana-cell{background:#fffefa;border:1px solid var(--line);border-radius:8px;padding:15px 5px;display:grid;place-items:center;font:25px var(--serif)}.kana-cell span{font:10px sans-serif;color:#96a484;margin-top:6px}.kana-cell.blank{background:transparent;border-color:transparent;pointer-events:none}.kana-note{max-width:650px;margin:25px auto}.settingsgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.settingrow{display:flex;gap:15px;align-items:center;margin:20px 0}.settingrow select{background:#f8faf2;border:1px solid var(--line);border-radius:5px;padding:8px;color:var(--ink)}.weekchart{display:flex;gap:13px;height:180px;align-items:end;margin:20px 0}.daybar{display:flex;flex:1;flex-direction:column;align-items:center;gap:10px}.daybar i{width:80%;max-width:40px;background:#b1c49a;border-radius:5px 5px 0 0;min-height:3px}.daybar small{font-size:10px;color:#95a386}.reportrow{padding:15px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:15px}.modalback{position:fixed;inset:0;background:#263c3460;z-index:100;display:grid;place-items:center;padding:20px;backdrop-filter:blur(4px)}.modal{background:#fffefa;border-radius:15px;width:min(560px,100%);max-height:85vh;overflow:auto;padding:30px}.modal h2{margin-bottom:20px}.modal .close{float:right;font-size:23px;margin-top:-7px}.modal p{color:#839474;font-size:13px;line-height:2;margin:14px 0}#toast{position:fixed;bottom:25px;left:calc(50% + 100px);transform:translateX(-50%);padding:14px 22px;border-radius:8px;background:#244b3f;color:white;z-index:200;box-shadow:0 8px 30px #20382c20;display:none;max-width:90vw;font-size:12px}.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.spaced{margin-top:22px}.smallbutton{font-size:10px;padding:6px 9px;border:1px solid var(--line);border-radius:4px}.focusquote{font:22px/1.7 var(--serif);color:#63805a}.source{margin-top:30px;font-size:10px;line-height:1.9;color:#9aa48e}.source a{text-decoration:underline}.lesson-tabs{display:flex;gap:5px;margin-bottom:23px;border-bottom:1px solid var(--line)}.lesson-tabs button{padding:13px 18px;font-size:12px;border-bottom:2px solid transparent;color:#94a085}.lesson-tabs button.active{border-color:var(--green);color:var(--green)}
@media(min-width:1550px){main{padding-top:45px}.hero{min-height:300px}.herocopy{padding:37px}.hero h2{font-size:36px}.hero p{font-size:13px}.task{padding:24px}.featurevisual{height:145px}}
@media(max-width:1150px){.sidebar{width:195px;padding:30px 17px}.brand{font-size:18px}.shell{margin-left:195px}main{padding:30px 27px}header{padding:0 27px}.stat{padding:15px 12px;gap:9px}.stat-icon{width:30px;height:30px}.hero h2{font-size:25px}.homecols{gap:18px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.wordcards{grid-template-columns:repeat(3,minmax(0,1fr))}.studygrid{grid-template-columns:minmax(0,1fr) 235px}.panel{padding:22px}.sidebottom{padding-left:6px}}
@media(max-width:850px){.sidebar{width:78px;padding:26px 13px}.brand>span:last-child,.navcaption,.sidebottom,nav .navlabel,nav .navbadge{display:none}.brandmark{width:46px}.brand{justify-content:center}nav{margin-top:35px}nav button{justify-content:center;padding:15px 0}nav button.active:after{display:none}.shell{margin-left:78px}.homecols{grid-template-columns:1fr}.homeright{display:grid;grid-template-columns:1fr 1fr;gap:16px}.homeright>.sectionhead{grid-column:1/-1;margin:10px 0 -3px}.quote{margin:0}.stats{gap:9px}.stat{flex-direction:column;align-items:start}.stat-icon{display:none}.studygrid{grid-template-columns:1fr}.studyaside{display:grid;grid-template-columns:1fr 1fr;gap:15px}.studyaside>.panel{margin:0!important}.wordcards{grid-template-columns:repeat(3,minmax(0,1fr))}#toast{left:50%}}
@media(max-width:600px){.sidebar{inset:auto 0 0 0;width:auto;height:64px;padding:0;background:#fffefaed;border-right:0;border-top:1px solid var(--line);backdrop-filter:blur(10px)}.brand{display:none}nav{margin:0;display:grid;grid-template-columns:repeat(6,1fr);gap:0;height:64px}nav button{flex-direction:column;gap:4px;padding:8px 0;border-radius:0}nav .navlabel{display:block;font-size:9px}nav button[data-go="kana"],nav button[data-go="progress"]{display:none}.shell{margin:0;padding-bottom:65px}header{height:59px;padding:0 20px}.header-actions{gap:13px}main{padding:25px 18px 15px}.pageintro{margin-bottom:22px}.greeting-title,h1{font-size:25px}.date{display:none}.hero{grid-template-columns:1fr;min-height:310px}.herocopy{padding:25px;z-index:2}.hero h2{font-size:25px}.hero p{max-width:200px}.town{position:absolute;width:67%;right:-30px;bottom:-25px;height:230px;opacity:.6}.hero .primary{gap:20px}.stats{grid-template-columns:repeat(4,1fr);gap:7px;margin:15px 0 25px}.stat{padding:12px 8px}.stat strong{font-size:20px}.stat strong small{font-size:8px;margin-left:2px}.stat label{font-size:8px}.task{padding:17px 14px;gap:12px}.taskicon{width:40px;height:43px}.homeright{grid-template-columns:1fr}.quote{margin:0}.journeymap{flex-direction:column;gap:15px;padding:18px}.milestone{border-right:0;border-bottom:1px dashed var(--line);padding-bottom:12px;text-align:left;display:grid;grid-template-columns:60px 1fr 60px;align-items:center}.milestone b{margin:0}.milestone small{text-align:right}.journey{margin-top:25px}footer{padding:22px 20px;line-height:1.9;gap:15px}.cards,.animes,.settingsgrid{grid-template-columns:1fr}.wordcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.wordcard{padding:17px 13px}.studyaside{grid-template-columns:1fr}.panel{padding:20px}.formula{font-size:20px;padding:20px}.lesson-tabs button{padding:13px 12px;font-size:11px}.jp{font-size:20px}.search{min-width:100%}.toolbar{gap:7px}.chip{padding:7px 10px;font-size:10px}.pageintro .outline{font-size:10px;padding:8px 10px}.chat-bubble.user{margin-left:23px}.flashcard{min-height:290px}.flashcard .bigword{font-size:40px}.reviewactions{gap:8px}.reviewactions button{font-size:12px}.reviewactions small{font-size:9px}.kana-cell{padding:11px 5px;font-size:23px}.sectionhead .textlink{font-size:9px}}
