:root{--ink:#13274c;--body:#31486e;--muted:#627594;--blue:#326bb2;--blue2:#4a83cc;--line:#d8e3f1;--soft:#f5f9ff;--mint:#e9f8f3;--peach:#fff2e9;--lav:#f3f2ff}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font-family:Pretendard,"Apple SD Gothic Neo","Malgun Gothic",Arial,sans-serif;font-size:17px;line-height:1.5}button,input,textarea,select{font:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}a{color:inherit;text-decoration:none}:focus-visible{outline:3px solid #efad52;outline-offset:3px}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.serif{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.3px}
.app-header{height:70px;border-bottom:1px solid #e2e8f0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:0 3.15%;background:#fff;position:sticky;top:0;z-index:30}.logo-group{display:flex;align-items:center;min-width:0}.logo{font-size:28px;font-weight:850;letter-spacing:-1.4px;white-space:nowrap}.tagline{margin-left:20px;padding-left:20px;border-left:1px solid #d6dfeb;color:#536b90;font-size:15px;font-weight:600;white-space:nowrap}.main-nav{display:flex;align-items:stretch;height:100%;gap:22px}.nav-link{border:0;border-bottom:3px solid transparent;background:none;color:#60718e;font-size:16px;font-weight:700;padding:5px 9px 0;white-space:nowrap}.nav-link.active{color:var(--ink);border-color:var(--ink)}.header-end{display:flex;align-items:center;justify-content:flex-end;gap:24px;color:#657791;font-size:14px;font-weight:650;white-space:nowrap}.avatar{width:45px;height:45px;display:grid;place-items:center;border-radius:50%;background:#edf2f9;color:#3b5680;font-size:23px}.mobile-menu{display:none;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);padding:5px 10px}
.screen{max-width:1672px;margin:auto;padding:32px 3.15% 38px;min-height:calc(100vh - 70px)}.screen.compact{padding-top:22px}.crumbline{height:50px;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:12px}.back{border:0;background:transparent;color:#17335f;font-weight:750;padding:0;display:inline-flex;align-items:center;gap:12px;white-space:nowrap}.back .arrow{font-size:22px;font-weight:400;line-height:1}.top-progress{display:flex;align-items:center;gap:18px;color:#254267;font-weight:700;white-space:nowrap}.top-progress strong{font-size:22px}.top-progress .rail{width:280px;height:13px;border-radius:99px;background:#dfe5ed;overflow:hidden}.top-progress .rail i{display:block;background:#396ca9;height:100%;border-radius:99px}.top-progress .clock{font-size:20px;margin-left:20px}.top-progress .clock b{font-weight:750}.card{border:1px solid var(--line);border-radius:16px;background:#fff}.card-pad{padding:30px 34px}.card h2,.card h3{margin:0;color:var(--ink)}.muted{color:var(--muted)}.soft-panel{background:#f3f8ff;border-radius:14px}.btn{min-height:50px;padding:10px 21px;border-radius:10px;border:1px solid #abc4e6;background:#fff;color:#1b4b82;font-weight:750;display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap}.btn:hover:not(:disabled){background:#f3f8ff;box-shadow:0 6px 15px rgba(36,82,137,.09)}.btn.primary{background:#3e6fab;border-color:#3e6fab;color:#fff}.btn.primary:hover:not(:disabled){background:#2d609e}.btn.big{padding:15px 30px;min-height:64px;font-size:20px}.btn.flat{border-color:transparent;background:transparent}.btn.small{min-height:39px;padding:7px 13px;font-size:14px}.btn.linkish{text-decoration:underline;border:0}.action-row{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.action-row .group{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.pill{background:#e8f2ff;border-radius:99px;padding:6px 14px;color:#2a5b95;font-weight:800;font-size:14px;display:inline-flex;align-items:center;gap:6px}.pill.mint{background:#e0f5ed;color:#226950}.pill.amber{background:#fff0d2;color:#875d16}.pill.red{background:#ffe9e9;color:#a74049}.eyebrow{font-size:20px;font-weight:750;color:#234a7e}.h1{font-size:clamp(32px,3vw,48px);letter-spacing:-2px;line-height:1.2;margin:10px 0 12px;font-weight:850}.lead{font-size:20px;color:#52698c;margin:0 0 25px}.divider{border-top:1px solid #e1e8f2}.highlight-blue{background:#dceeff;border-radius:6px;padding:2px 5px;box-decoration-break:clone}.highlight-mint{background:#d9f3e9;border-radius:6px;padding:2px 5px;box-decoration-break:clone}.highlight-peach{background:#ffeadb;border-radius:6px;padding:2px 5px;box-decoration-break:clone}
/* 01 — 문제 화면 */
.problem-layout{display:grid;grid-template-columns:minmax(0,1.58fr) minmax(490px,.97fr);gap:17px;align-items:stretch}.problem-left{display:grid;grid-template-rows:auto 1fr;gap:16px}.reading-box{padding:28px 34px;min-height:365px}.reading-box h2{font-size:21px;margin:0 0 23px}.reading-passage{font-size:23px;line-height:1.65;color:#243654;margin:0}.question-box{padding:25px 34px;min-height:370px;display:flex;flex-direction:column}.question-box h2{font-size:21px;margin:0 0 17px}.question-box h2 b{font-size:31px;color:#1a4f8e;margin-right:14px}.answer-list{display:grid;gap:8px;margin-bottom:20px}.answer-option{border:1px solid transparent;border-radius:9px;background:#fff;text-align:left;color:#324663;padding:3px 8px;font-size:19px;line-height:1.5;display:flex;gap:15px;align-items:flex-start}.answer-option:hover,.answer-option.selected{background:#eaf4ff;border-color:#b8d8ff}.answer-option.correct{background:#e7f7ef;border-color:#9ed9bb}.answer-option .num{border:1px solid #5c7396;border-radius:50%;height:25px;width:25px;flex:none;text-align:center;line-height:22px;font-size:16px;margin-top:1px}.question-foot{margin-top:auto;display:flex;justify-content:space-between}.toolkit{padding:25px 16px 16px;background:#fcfdff}.toolkit-head{display:flex;justify-content:space-between;align-items:center;padding:0 16px;margin-bottom:20px}.toolkit-head h2{font-size:25px}.toolkit-head span{font-size:13px;color:#647895}.tooltabs{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-bottom:28px}.tooltab{border:1px solid #dce6f2;background:#fff;border-radius:10px;min-height:119px;color:#345071;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:9px;font-size:13px;font-weight:700;text-align:center;padding:8px 3px}.tooltab .ico{font-size:23px;color:#2b5e9e}.tooltab.active{background:#e8f4ff;border-color:#d4e9ff;color:#144c8a}.tooltab small{font-size:11px;font-weight:500}.tool-preview{border:1px solid #dce6f2;border-radius:12px;padding:18px 18px 15px;min-height:458px;background:#fff}.tool-preview h3{font-size:21px}.tool-preview p{margin:4px 0 12px;color:#637790}.inline-chunks{padding:16px 14px;background:#f2f8ff;border-radius:10px;font-size:22px;line-height:2}.tool-preview .explain{font-size:15px;line-height:1.5;color:#4a5e7d;margin:16px 0}.tool-preview .btn{font-size:15px}
/* 02 — 빠른 도움 */
.quick-grid{display:grid;grid-template-columns:29% 1fr;min-height:calc(100vh - 70px)}.context-rail{border-right:1px solid #e1e7ef;padding:33px 24px 25px 9%}.context-rail .back{margin-bottom:25px}.context-card{padding:24px 25px;min-height:750px}.context-card h2{font-size:21px;margin:0 0 19px}.context-card .reading-passage{font-size:20px;line-height:1.63}.context-card .btn{margin-top:28px}.quick-main{padding:39px 4% 32px}.quick-head{display:grid;grid-template-columns:1fr 380px;gap:22px;margin-bottom:28px}.quick-head .h1{margin:3px 0 4px}.goal{background:#f1f7ff;border-radius:14px;display:flex;align-items:flex-start;gap:17px;padding:21px 24px;color:#2a4774}.goal .ico{font-size:28px}.goal strong{display:block;margin-bottom:4px}.chunk-stack{display:grid;gap:18px}.chunk-card{display:flex;align-items:flex-start;gap:28px;border:1px solid;border-radius:15px;min-height:130px;padding:22px 24px}.chunk-card.blue{background:#f0f7ff;border-color:#cfe2fb}.chunk-card.mint{background:#effaf6;border-color:#cde8dd}.chunk-card.peach{background:#fff6ef;border-color:#f6dccb}.chunk-card .round{height:55px;width:55px;flex:none;border-radius:50%;display:grid;place-items:center;font:700 28px Georgia,serif;background:#dcecff;color:#1d4d87}.chunk-card.mint .round{background:#d4f2e6;color:#195c49}.chunk-card.peach .round{background:#ffe4d1;color:#905023}.chunk-card .en{font-size:31px;font-weight:700;line-height:1.2}.chunk-card .ko{font-size:21px;margin-top:11px;color:#39516f}.chunk-card .ko.blurred{filter:blur(6px);user-select:none}.whole-translation{width:100%;border:1px solid var(--line);background:#fff;color:#24476f;border-radius:10px;padding:13px 25px;margin-top:18px;text-align:left;font-weight:750}.translation-content{border:1px solid var(--line);border-top:0;padding:17px 25px;border-radius:0 0 10px 10px}.quick-actions{margin-top:28px}
/* 03 — 구조 자세히 */
.detail-tabs{display:inline-flex;border:1px solid var(--line);border-radius:12px 12px 0 0;overflow:hidden;margin-top:8px}.detail-tabs button{border:0;border-bottom:3px solid transparent;background:#f8fbff;color:#526b90;min-width:210px;padding:18px 22px;font-weight:700}.detail-tabs button.active{background:#fff;border-bottom-color:#2f6eb7;color:#164c8d}.detail-grid{display:grid;grid-template-columns:1.39fr 1fr;gap:16px;margin-top:-1px}.detail-pane{padding:26px 33px;min-height:695px}.detail-pane h2{font-size:26px;margin-bottom:18px}.detail-sample{background:#eef6ff;border-radius:10px;padding:20px 23px;font-size:27px;line-height:2;min-height:150px}.detail-meaning{margin-top:35px}.meaning-table{border:1px solid var(--line);border-radius:10px;padding:0 20px}.meaning-row{display:grid;grid-template-columns:170px 1fr;align-items:center;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}.meaning-row:last-child{border-bottom:0}.meaning-row b{border-radius:9px;padding:10px 13px;font-size:17px}.meaning-row .en{font-size:23px}.meaning-row .ko{color:#607596}.tree{display:grid;justify-items:center;gap:9px}.tree-node{width:76%;border:1px solid;border-radius:11px;padding:13px 18px;min-height:118px}.tree-node b{font-size:17px}.tree-node .en{font-size:21px;line-height:1.4;margin:3px 0}.tree-node .ko{font-size:16px;color:#627594}.tree-node.blue{background:#f0f7ff;border-color:#b7d7fa}.tree-node.mint{background:#f0faf6;border-color:#addfcd}.tree-node.peach{background:#fff6ee;border-color:#f0cba8}.tree-bridge{border:1px solid #c8d8ee;border-radius:99px;padding:3px 17px;color:#5d7290;font-size:14px}.tree-arrow{line-height:10px;color:#8098bc;font-size:27px}
/* 04 — 대시보드 */
.dash-top{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin:11px 0 24px}.dash-top .h1{font-size:53px}.dash-greeting{background:#f1f7ff;border-radius:17px;padding:20px 26px;min-width:435px;display:flex;gap:25px;align-items:center}.dash-greeting b{font-size:19px;color:#4078bd}.mascot{font-size:70px;color:#3168aa;line-height:1}.dash-feature{padding:28px 34px;display:grid;grid-template-columns:1.1fr .58fr auto;align-items:center;gap:32px;min-height:280px}.dash-feature h2{font-size:40px;letter-spacing:-1.7px;margin:14px 0 2px}.dash-feature p{margin:0;color:#51698c;font-size:20px}.feature-meta{display:flex;gap:35px;margin-top:26px;color:#304c76}.feature-meta div{display:flex;gap:10px;align-items:center}.feature-art{height:168px;border-radius:17px;background:#f1f7ff;display:grid;place-items:center;padding:18px}.feature-art .paper{background:#fff;border:1px solid #d7e4f2;border-radius:10px;padding:23px;font:21px Georgia,serif;color:#294b75;box-shadow:0 8px 20px #dce8f7}.dash-section-head{display:flex;justify-content:space-between;align-items:center;gap:25px;margin:37px 0 17px}.dash-section-head h2{font-size:27px;margin:0}.dash-progress{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.progress-card{border:1px solid;border-radius:16px;min-height:230px;padding:27px 28px}.progress-card.blue{background:#f7fbff;border-color:#d2e7ff}.progress-card.mint{background:#f7fdfb;border-color:#cfebdf}.progress-card.lav{background:#faf9ff;border-color:#dedcff}.progress-card .icon-box{height:80px;width:80px;border-radius:15px;background:#e0edff;display:grid;place-items:center;font-size:38px;float:left;margin-right:25px}.progress-card.mint .icon-box{background:#dcf5ec}.progress-card.lav .icon-box{background:#e9e8ff}.progress-card h3{font-size:27px;line-height:1.25;margin:6px 0 20px}.meter{height:17px;border-radius:99px;background:#dfe6ef;overflow:hidden}.meter i{display:block;height:100%;border-radius:99px;background:#4c8bdc}.progress-card.mint .meter i{background:#64b99e}.progress-card.lav .meter i{background:#8274e8}.progress-card p{font-size:17px;color:#4e6688}.curriculum-wrap{margin-top:28px}.level-tabs{display:flex;gap:8px;margin:16px 0}.level-tabs button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 14px;color:#415e83}.level-tabs button.active{background:#e7f2ff;color:#16518e;border-color:#a9cff7}.unit-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.unit{border:1px solid var(--line);border-radius:10px;padding:10px;min-height:73px;text-align:left;background:#fff;color:#425a7c}.unit b{display:block;color:#274c7d}.unit small{font-size:12px}.unit.active{background:#e7f2ff;border-color:#9cc7f4}
/* 05 — 규칙 수업 */
.lesson-top{max-width:1250px;margin:auto}.lesson-track{display:flex;align-items:center;justify-content:center;gap:12px;margin:13px auto 32px}.lesson-step{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:700;color:#687c99}.lesson-step .badge{border-radius:50%;height:46px;width:46px;display:grid;place-items:center;background:#e8edf4;color:#657b97;font-size:20px}.lesson-step.done .badge{background:#dcecff;color:#245b9c}.lesson-step.active .badge{background:#386db6;color:#fff}.lesson-line{width:96px;height:2px;background:#dbe3ed}.lesson-core{max-width:1230px;margin:auto}.lesson-core .h1{font-size:50px}.lesson-core .chunk-card{margin-bottom:15px}.lesson-core .chunk-card .en{font-size:33px}
/* 06—08 exercise frames */
.exercise-card{padding:43px 49px;min-height:700px}.exercise-label{font-size:22px;font-weight:700;color:#2e598f}.exercise-title{font-size:44px;letter-spacing:-1.5px;margin:17px 0 20px}.exercise-sub{font-size:22px;color:#4d6689;margin:0 0 31px}.exercise-foot{border-top:1px solid #e2e8f1;margin-top:31px;padding-top:30px;display:flex;justify-content:space-between;align-items:center;gap:20px}.word-line{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:30px 0 50px}.word-token{display:inline-flex;align-items:center;justify-content:center;min-height:76px;padding:0 14px;border:1px solid #d0deee;border-radius:9px;background:#fff;font:27px Georgia,serif;white-space:nowrap}.gap{width:13px;height:77px;background:transparent;border:0;border-radius:5px;position:relative;margin:0 -3px;color:transparent;flex:none}.gap:hover,.gap.selected{background:#dcefff;color:#226cc0}.gap.selected:before{content:"";height:78px;width:3px;background:#3683d5;position:absolute;left:5px;top:-1px}.gap.selected:after{content:"●";position:absolute;left:-8px;bottom:-18px;font-size:20px;color:#3683d5}.exercise-hint{border-radius:14px;background:#f0f7ff;padding:28px 30px;display:flex;align-items:center;gap:20px;min-height:132px;color:#355b89}.exercise-hint .ico{border-radius:50%;background:#dcecff;height:55px;width:55px;display:grid;place-items:center;font-size:27px;flex:none}.exercise-hint b{font-size:19px}.exercise-hint p{margin:3px 0 0;color:#516a8e}.order-hint{background:#f0f7ff;border-radius:13px;padding:20px 26px;font-size:22px;margin-bottom:20px}.slots{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:35px 0 42px}.slot-wrap{position:relative}.slot-num{position:absolute;top:-18px;left:10px;border-radius:50%;background:#e3f1ff;height:39px;width:39px;display:grid;place-items:center;color:#2f61a1;font:700 22px Georgia,serif}.slot{border:2px dashed #c3d4e9;border-radius:14px;background:#fff;height:93px;width:100%;display:grid;place-items:center;color:#70819a;font-size:18px}.slot.fixed{background:#f0faf6;border:1px solid #a9dfcb;color:var(--ink);font:28px Georgia,serif}.slot.filled{background:#edf5ff;border-style:solid;color:var(--ink);font:27px Georgia,serif}.order-options{display:flex;gap:15px;flex-wrap:wrap;min-height:94px}.option-chip{border:1px solid #cfdcec;border-radius:13px;background:#fff;min-height:90px;min-width:32%;padding:10px 25px;font:27px Georgia,serif;color:var(--ink)}.option-chip.used{opacity:.42}.typing-stage{background:#f3f8ff;border-radius:14px;min-height:206px;display:grid;place-items:center;padding:28px;margin-bottom:26px;text-align:center}.typing-line{display:flex;align-items:center;justify-content:center;gap:12px;font:42px Georgia,serif}.typing-input{width:255px;border:1.5px solid #4082cd;border-radius:11px;background:#fff;padding:9px 16px;font:34px Georgia,serif;color:var(--ink);height:73px}.typing-stage p{color:#536b90;font-size:21px;margin:10px 0 0}.typing-info{background:#f2f7ff;border-radius:13px;padding:25px 30px;display:flex;align-items:center;justify-content:space-between;gap:20px}.typing-info b{font-size:19px}.typing-info p{margin:4px 0;color:#607490}
/* 09 speaking */
.speak-grid{display:grid;grid-template-columns:1.58fr .97fr;gap:18px}.speak-left,.speak-right{display:grid;gap:17px}.speak-left .card,.speak-right .card{padding:25px 29px}.speak-left h2,.speak-right h2{font-size:26px}.speak-chunks{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0 13px}.speak-chunk{border-radius:13px;min-height:122px;padding:23px 20px;font:26px Georgia,serif;line-height:1.35}.speak-chunk.blue{background:#edf6ff}.speak-chunk.mint{background:#effaf6}.speak-chunk.peach{background:#f4f8ff}.wave{width:100%;height:66px}.speak-note{background:#f2f7ff;border-radius:10px;padding:18px 22px;color:#4f6889;font-size:17px}.audio-ui{display:flex;align-items:center;gap:19px;margin:19px 0}.audio-play{height:70px;width:70px;border-radius:50%;background:#457fc6;border:0;color:#fff;font-size:27px;flex:none}.audio-line{height:11px;border-radius:99px;background:#dfe6f0;flex:1}.speed-controls{display:flex;align-items:center;gap:12px}.speed-controls button{flex:1}.speed-controls button.active{border-color:#357bd0;background:#edf6ff}.record-big{width:100%;background:#4688cb;border:0;border-radius:10px;color:#fff;padding:16px;font-size:20px;font-weight:750;margin:18px 0}.check-row{display:flex;align-items:flex-start;gap:10px;color:#4b6383;margin:7px 0}
/* 10 transfer */
.transfer-grid{display:grid;grid-template-columns:1.62fr .97fr;gap:20px;min-height:700px}.transfer-left,.transfer-right{padding:31px 37px}.transfer-left .h1{font-size:45px}.transfer-sentence{margin:27px 0 25px;padding:28px 30px;background:#f2f7ff;border-radius:15px;font:36px Georgia,serif;line-height:1.6}.transfer-right .success-head{display:flex;align-items:flex-start;gap:20px;margin:22px 0 35px}.success-check{height:70px;width:70px;border-radius:50%;background:#dcf6e9;color:#308765;display:grid;place-items:center;font-size:38px;flex:none}.success-head h2{font-size:29px}.success-head p{font-size:19px;color:#4b6683}.selected-chunks{border:1px solid var(--line);border-radius:12px;padding:24px;margin-bottom:54px}.selected-chunks .inline-chunks{background:#fff;padding:9px 0}.transfer-right .btn{width:100%;margin:8px 0}
/* 11 alternatives */
.ambiguity-head{text-align:center;margin:-5px auto 27px}.ambiguity-head .h1{font-size:42px}.ambiguity-sentence{max-width:920px;margin:auto;background:#f2f7ff;border-radius:13px;text-align:center;padding:20px;font:40px Georgia,serif}.amb-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:26px 3% 22px}.amb-card{padding:24px 20px;border:1px solid;border-radius:16px}.amb-card.blue{border-color:#b9d9ff;background:#f9fcff}.amb-card.mint{border-color:#b9e6d6;background:#f9fefc}.amb-head{display:flex;align-items:center;gap:20px}.amb-head .letter{height:70px;width:70px;flex:none;border-radius:50%;background:#daebff;color:#22589a;display:grid;place-items:center;font-size:35px;font-weight:750}.amb-card.mint .letter{background:#d8f4e9;color:#246b55}.amb-head h2{font-size:26px;margin:0}.amb-head p{margin:3px 0;color:#607490}.amb-diagram{background:#fff;border-radius:12px;min-height:180px;margin-top:18px;text-align:center;padding:22px 10px}.amb-diagram .en{font:36px Georgia,serif}.amb-diagram p{color:#2b5e9d;font-weight:700;margin:20px 0 0}.amb-info{background:#f1f6ff;border-radius:12px;padding:15px 24px;text-align:center;margin:0 3% 20px;color:#315c8e}
/* 12 QA */
.qa-head{display:grid;grid-template-columns:1.15fr .45fr .55fr;align-items:end;gap:20px;margin-bottom:16px}.qa-head .h1{font-size:38px;margin:4px 0}.qa-head p{color:#5e7290;margin:0}.qa-nav{text-align:center;font-size:20px}.qa-status{text-align:center}.qa-grid{display:grid;grid-template-columns:1.62fr 1fr;gap:17px}.qa-left,.qa-right{display:grid;gap:16px}.qa-left .card,.qa-right .card{padding:17px 21px}.qa-card-head{display:flex;align-items:center;justify-content:space-between}.qa-card-head h2{font-size:21px}.qa-target{background:#f2f7ff;border:1px solid #d8e9fd;border-radius:8px;padding:14px 18px;font:28px Georgia,serif;margin:13px 0}.qa-chunk-row{display:flex;gap:16px;align-items:center;margin:10px 0 21px}.qa-mini{flex:1;border-radius:8px;padding:7px 12px;font:22px Georgia,serif}.qa-mini.blue{background:#dceeff}.qa-mini.mint{background:#daf5e9}.qa-mini.peach{background:#ffe9d8}.qa-mismatch{background:#fff6f6;border-color:#f1d7dc!important}.agent-cols{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:12px 0}.agent-col{padding:12px 16px;background:#fff;border-radius:9px}.agent-col h3{font-size:17px}.agent-col p{font-size:15px;margin:8px 0}.qa-pipeline{display:flex;justify-content:space-between;gap:4px;margin:15px 0 8px}.qa-pipeline div{text-align:center;flex:1}.qa-pipeline i{display:grid;place-items:center;background:#3271bd;color:#fff;border-radius:50%;height:33px;width:33px;margin:0 auto 5px;font-style:normal}.qa-list{display:grid;gap:6px;margin-top:10px}.qa-list button{background:#fff;border:1px solid var(--line);border-radius:9px;padding:7px 9px;text-align:left;color:#354e73;font-size:14px}.qa-work{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.qa-work button{font-size:13px;min-height:53px;white-space:normal;padding:6px}
/* 13 feedback */
.feedback-head{text-align:center;margin:-4px auto 25px}.feedback-head .h1{font-size:47px}.feedback-example{padding:18px 25px;text-align:center}.feedback-example .sentence{font:39px Georgia,serif;margin:0 0 22px}.feedback-pieces{display:flex;gap:10px;justify-content:center;align-items:center}.feedback-piece{background:#f0f7ff;border:1px solid #cfe2fb;border-radius:12px;padding:16px 25px;font:28px Georgia,serif;white-space:nowrap}.feedback-piece.bad{background:#fff5f6;border-color:#f07078}.feedback-piece.good{background:#f0fbf6;border-color:#68c895}.feedback-stacks{display:grid;gap:13px;margin:15px 0}.feedback-row{display:flex;align-items:center;gap:25px;padding:15px 23px;border:1px solid;border-radius:14px;min-height:94px}.feedback-row.green{background:#f0faf6;border-color:#cce9dc}.feedback-row.blue{background:#f0f7ff;border-color:#d0e4fb}.feedback-row .icon{height:57px;width:57px;border-radius:50%;display:grid;place-items:center;background:#deecff;color:#2568b3;font-size:26px;flex:none}.feedback-row.green .icon{background:#ddf5e8;color:#2a815d}.feedback-row h3{font-size:21px;margin:0}.feedback-row p{color:#5a7090;margin:2px 0 0}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#19355d;color:#fff;padding:11px 20px;border-radius:9px;box-shadow:0 14px 30px #0003;z-index:50}.hide{display:none!important}.site-footer{max-width:1672px;margin:auto;padding:18px 3.15%;border-top:1px solid #e6edf5;color:#7c8ca2;font-size:12px;display:flex;flex-wrap:wrap;gap:10px}.site-footer a{text-decoration:underline}.notes-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.textarea{width:100%;min-height:160px;border:1px solid #c9d9ec;border-radius:10px;padding:15px;color:var(--ink)}
@media(max-width:1300px){.tagline,.header-end>span:first-child{display:none}.problem-layout,.speak-grid,.transfer-grid{grid-template-columns:1.25fr 1fr}.quick-head{grid-template-columns:1fr}.quick-head .goal{display:none}.tooltab{min-height:102px}.tooltabs{gap:2px}.tooltab small{display:none}.detail-tabs button{min-width:165px}.dash-feature{grid-template-columns:1fr .5fr}.dash-feature>.btn{grid-column:1/-1;justify-self:end}.qa-grid{grid-template-columns:1.3fr 1fr}.feedback-piece{padding:12px 15px;font-size:23px}}
@media(max-width:980px){.app-header{grid-template-columns:1fr auto}.main-nav{display:none;position:absolute;top:70px;left:0;right:0;height:auto;background:white;border-bottom:1px solid var(--line);padding:10px 20px;box-shadow:0 8px 20px #172f5b18}.main-nav.open{display:flex;flex-direction:column;gap:0}.nav-link{text-align:left;padding:12px;border-bottom:0}.nav-link.active{background:#e9f3ff}.mobile-menu{display:block}.screen{padding:24px 22px}.quick-grid{grid-template-columns:1fr}.context-rail{border-right:0;border-bottom:1px solid var(--line);padding:18px 22px}.context-card{display:none}.quick-main{padding:25px 22px}.problem-layout,.speak-grid,.transfer-grid,.detail-grid,.qa-grid{grid-template-columns:1fr}.tool-preview{min-height:300px}.dash-greeting{display:none}.dash-feature{grid-template-columns:1fr}.feature-art{display:none}.dash-progress{grid-template-columns:1fr 1fr 1fr}.progress-card{padding:18px;min-height:210px}.progress-card .icon-box{float:none;margin:0 0 8px;height:50px;width:50px;font-size:27px}.progress-card h3{font-size:20px}.unit-grid{grid-template-columns:repeat(4,1fr)}.detail-pane{min-height:auto}.lesson-step{font-size:14px}.lesson-step .badge{height:34px;width:34px;font-size:16px}.lesson-line{width:35px}.exercise-card{padding:25px}.word-token{font-size:22px;min-height:60px}.gap{height:60px}.gap.selected:before{height:60px}.amb-grid{margin:20px 0;gap:12px}.amb-card{padding:15px}.amb-head h2{font-size:19px}.amb-diagram .en{font-size:24px}.qa-head{grid-template-columns:1fr 1fr}.qa-head>:first-child{grid-column:1/-1}}
@media(max-width:650px){body{font-size:15px}.app-header{height:62px;padding:0 15px}.logo{font-size:20px}.header-end .avatar{height:34px;width:34px;font-size:18px}.main-nav{top:62px}.screen{padding:20px 15px}.crumbline{height:auto;align-items:center;flex-wrap:wrap;margin-bottom:15px}.top-progress{gap:7px;font-size:12px}.top-progress .rail{width:88px;height:8px}.top-progress .clock{display:none}.top-progress .btn{display:none}.h1,.lesson-core .h1{font-size:32px}.lead{font-size:16px}.problem-layout{display:block}.problem-left{display:block}.reading-box,.question-box,.toolkit{margin-bottom:12px;min-height:auto;padding:18px}.reading-passage{font-size:18px}.question-box h2{font-size:18px}.answer-option{font-size:15px}.tooltabs{grid-template-columns:repeat(3,1fr)}.tooltab{min-height:75px}.tool-preview{padding:14px}.quick-main{padding:22px 15px}.quick-head{margin-bottom:17px}.chunk-card{min-height:0;padding:16px;gap:12px}.chunk-card .round{height:38px;width:38px;font-size:18px}.chunk-card .en{font-size:22px}.chunk-card .ko{font-size:17px}.detail-tabs{width:100%}.detail-tabs button{min-width:0;flex:1;padding:11px 5px;font-size:13px}.detail-pane{padding:18px}.detail-sample{font-size:20px}.meaning-row{grid-template-columns:1fr;gap:4px}.tree-node{width:100%}.dash-top .h1{font-size:34px}.dash-feature{padding:22px;min-height:auto}.dash-feature h2{font-size:27px}.dash-feature p{font-size:16px}.feature-meta{flex-direction:column;gap:6px}.dash-progress{grid-template-columns:1fr}.progress-card{min-height:0}.dash-section-head{align-items:flex-start;flex-direction:column}.unit-grid{grid-template-columns:repeat(2,1fr)}.lesson-track{gap:4px;justify-content:flex-start;overflow-x:auto}.lesson-step{gap:4px;white-space:nowrap;font-size:11px}.lesson-step .badge{height:27px;width:27px;font-size:12px}.lesson-line{width:12px;flex:none}.exercise-card{padding:17px;min-height:auto}.exercise-title{font-size:31px}.exercise-sub{font-size:16px}.word-line{gap:2px;margin:20px 0 30px}.word-token{font-size:17px;padding:5px 7px;min-height:44px}.gap{height:44px;width:8px;margin:0 -2px}.gap.selected:before{height:45px;left:3px}.gap.selected:after{font-size:14px;left:-5px;bottom:-14px}.exercise-hint{padding:14px;min-height:0}.exercise-hint .ico{height:38px;width:38px;font-size:20px}.slots{gap:7px}.slot{height:65px;font-size:12px}.slot.fixed,.slot.filled{font-size:16px}.option-chip{min-width:100%;min-height:58px;font-size:20px}.typing-stage{padding:14px;min-height:170px}.typing-line{font-size:24px;flex-wrap:wrap}.typing-input{width:145px;height:55px;font-size:22px}.typing-info{flex-direction:column;align-items:flex-start;padding:16px}.speak-chunks{gap:4px}.speak-chunk{font-size:16px;padding:12px 9px;min-height:105px}.speak-left .card,.speak-right .card,.transfer-left,.transfer-right{padding:18px}.transfer-sentence{font-size:24px;padding:18px}.amb-grid{grid-template-columns:1fr}.ambiguity-head .h1{font-size:31px}.ambiguity-sentence{font-size:25px}.feedback-head .h1{font-size:30px}.feedback-example .sentence{font-size:25px}.feedback-pieces{flex-wrap:wrap}.feedback-piece{font-size:18px}.feedback-row{padding:12px;gap:12px}.feedback-row h3{font-size:17px}.qa-head{grid-template-columns:1fr}.qa-head>:first-child{grid-column:auto}.agent-cols{grid-template-columns:1fr}.qa-work{grid-template-columns:1fr}.notes-grid{grid-template-columns:1fr}.btn{white-space:normal}.site-footer{padding:15px}.action-row{align-items:stretch}.action-row .group{width:100%}}
@media(min-width:981px){.word-line{gap:2px;flex-wrap:nowrap}.word-token{padding:0 8px;font-size:25px}.gap{width:7px;margin:0 -2px}}
.speak-right .audio-ui{margin:10px 0}.speak-right .card{padding-top:20px;padding-bottom:20px}.speak-right{gap:14px}

/* LayerLab cutouts from the dashboard reference */
.dash-greeting{position:relative;min-width:575px;background:linear-gradient(90deg,#f1f7ff 0 75%,transparent 75%);padding-right:125px}.mascot-art{width:129px;height:104px;object-fit:contain;align-self:flex-end;margin-bottom:-20px}.handwritten-art{position:absolute;width:85px;height:62px;object-fit:contain;right:12px;top:27px}.feature-art{position:relative}.magnifier-art{position:absolute;width:77px;height:75px;object-fit:contain;right:13px;bottom:6px}.progress-card .icon-box img{width:54px;height:54px;object-fit:contain}.progress-card .icon-box{overflow:hidden}
@media(max-width:980px){.dash-greeting{display:none}}
.today-art{position:absolute;width:57px;height:37px;object-fit:contain;right:35px;top:9px}.handwritten-art{top:47px}
.history-row{display:grid;grid-template-columns:130px 140px 80px 1fr 160px;align-items:center;gap:10px;border-top:1px solid var(--line);padding:14px 0;color:#355377}.history-row strong{color:#25669e}.history-row small{color:#71839c}@media(max-width:700px){.history-row{grid-template-columns:1fr 1fr}.history-row span:nth-of-type(2){grid-column:1/-1}}
.analysis-consent{display:flex;align-items:flex-start;gap:10px;margin-top:16px;font-size:15px;color:#496383}.analysis-consent input{width:18px;height:18px;margin-top:1px;flex:none}
.qa-pipeline b{display:block;font-size:14px;line-height:1.25;max-width:115px;margin:auto}.qa-pipeline small{display:block;color:#7186a4;font-size:12px;margin-top:4px}.qa-meta{display:grid;grid-template-columns:1.5fr 1fr .4fr;gap:16px;margin-top:14px;border-top:1px solid var(--line);padding-top:15px}.qa-meta p{color:#5b7294;font-size:14px;margin:5px 0}.qa-check-row{display:grid;grid-template-columns:26px minmax(125px,1.1fr) auto minmax(120px,.8fr);align-items:center;gap:7px;min-height:41px;border:1px solid var(--line);border-radius:8px;padding:5px 8px;color:#2e4c77;font-size:13px}.qa-check-row .pill{font-size:11px;padding:4px 7px;white-space:nowrap}.qa-check-row small{color:#607995;font-size:11px}.qa-check-icon{color:#2f6eb5;font-size:17px}.qa-decision .textarea{min-height:56px;height:56px}.qa-decision .qa-work button{min-height:42px}.qa-right{gap:12px}.qa-right .card{padding:13px 17px}.qa-left .card{padding:16px 21px}.qa-left{gap:12px}@media(max-width:700px){.qa-meta{grid-template-columns:1fr}.qa-check-row{grid-template-columns:24px 1fr auto}.qa-check-row small{grid-column:2/-1}.qa-pipeline b{font-size:11px}}
@media(min-width:981px){.reading-box .reading-passage{font-size:21px;line-height:1.68}.tool-preview .inline-chunks{font-size:20px}}

/* Keep all three speaking controls in the 1672 × 941 design viewport. */
@media(min-width:981px){.speak-right .card{padding:15px 20px}.speak-right h2{font-size:23px;margin:0 0 7px}.speak-right p{margin:5px 0}.speak-right .audio-ui{margin:8px 0}.speak-right .audio-play{height:54px;width:54px}.speak-right .record-big{margin:9px 0;padding:11px}.speak-right .check-row{margin:4px 0;font-size:14px}.speak-right .card:last-child .btn{margin-top:8px}}
@media(min-width:981px){.qa-left,.qa-right{align-content:start;grid-auto-rows:max-content}.qa-check-row{min-height:37px}.qa-decision .qa-work button{min-height:38px}}
