:root{--blue:#087ac1;--navy:#123d63;--cyan:#07a8df;--mint:#def8ed;--green:#177450;--pale:#eef8ff;--ink:#163c59;--muted:#557087;--line:#cce4f3;--radius:26px;--text:clamp(20px,1.8vw,30px)}*{box-sizing:border-box}body{margin:0;background:#f0f8ff;color:var(--ink);font-family:Arial,Helvetica,sans-serif;min-height:100dvh;display:flex;flex-direction:column}button,input,textarea,select{font:inherit}button{touch-action:manipulation;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:4px solid #08a8df;outline-offset:4px}button{border:0}header{background:#fff;border-bottom:1px solid var(--line);padding:12px clamp(14px,3vw,48px);display:flex;align-items:center;justify-content:space-between;gap:14px;position:sticky;top:0;z-index:20}.brand{font-size:clamp(18px,1.8vw,28px);font-weight:800;color:var(--navy)}.brand small{display:block;font-size:13px;letter-spacing:.12em;color:var(--blue);margin-top:4px}.tools{display:flex;gap:9px;align-items:center}.tool{border:1px solid var(--line);background:#eff8ff;padding:12px 17px;border-radius:14px;color:var(--navy);font-size:clamp(15px,1.2vw,21px);font-weight:700;min-height:49px}.tool:hover,.word:hover,.room-choice:hover{background:#e0f3ff}.tool:disabled{opacity:.4;cursor:default}.progress-track{height:5px;background:#d9edf9}.progress-track i{display:block;background:linear-gradient(90deg,#087ac1,#1fc5de);height:100%;transition:width .3s}main{width:100%;max-width:1680px;margin:0 auto;padding:clamp(18px,2.2vw,38px);flex:1}h1{font-size:clamp(32px,3.6vw,62px);line-height:1.08;margin:8px 0 15px;letter-spacing:-.035em}h2{font-size:clamp(28px,2.6vw,43px);line-height:1.15;margin:5px 0 18px}p{font-size:var(--text);line-height:1.45;margin:10px 0 20px}.eyebrow{color:var(--blue);font-size:clamp(14px,1.3vw,20px);font-weight:800;letter-spacing:.11em;text-transform:uppercase}.lead{color:var(--muted);max-width:1060px}.hero{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,70px);align-items:center;min-height:65vh}.hero-image{width:100%;border-radius:32px;display:block;box-shadow:0 18px 48px #226d9b22}.pill{display:inline-flex;align-items:center;gap:8px;background:#dff1ff;border-radius:999px;padding:10px 19px;font-size:20px;font-weight:700;color:var(--blue)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:60px;padding:15px 27px;background:var(--blue);color:#fff;font-weight:800;font-size:clamp(20px,1.8vw,28px);border-radius:17px;box-shadow:0 5px 0 #075e99}.btn:active{transform:translateY(3px);box-shadow:0 2px 0 #075e99}.btn.light{background:#fff;color:var(--blue);box-shadow:none;border:2px solid #bedff2}.btn.green{background:#147954;box-shadow:0 5px 0 #0c583d}.btn:disabled{opacity:.4;cursor:default;transform:none}.actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:13px;margin-top:22px}.navline{display:flex;align-items:center;justify-content:space-between;gap:18px;max-width:1680px;padding:15px clamp(18px,3vw,48px) 10px;margin:auto;width:100%}.navline button{min-width:140px}.counter{font-size:17px;color:var(--muted);font-weight:700;text-align:center}.credit{font-size:clamp(12px,1.05vw,17px);padding:12px 15px 17px;text-align:center;color:#44667e;line-height:1.4}.credit b{color:#204e70}footer{background:#fff;border-top:1px solid var(--line)}.split{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.85fr);gap:30px;align-items:center}.photo{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;border-radius:24px;background:#d9ebf8;isolation:isolate}.photo img{width:100%;height:100%;display:block;object-fit:contain}.house{aspect-ratio:4/3;max-width:min(100%,calc((100dvh - 300px)*1.3333));margin:auto}.room-choice{position:absolute;transform:translate(-50%,-50%);font-size:clamp(13px,1.25vw,23px);font-weight:800;background:#fff;color:#075f99;border:2px solid #a5ddfa;border-radius:999px;padding:12px 18px;min-height:47px;box-shadow:0 4px 15px #123d6320;white-space:nowrap}.room-choice.selected{background:#087ac1;color:white;border-color:white}.room-list{display:grid;grid-template-columns:1fr 1fr;gap:12px}.word{border-radius:18px;background:#fff;border:2px solid var(--line);color:var(--navy);padding:17px 22px;min-height:70px;text-align:left;font-size:clamp(23px,2vw,34px);font-weight:700}.word small{display:block;font-size:.53em;color:var(--muted);font-weight:400;margin-top:5px}.word.active{background:#def3ff;border-color:var(--blue)}.word.speaking{background:#d9f8ec;border-color:#289370}.selected-name{min-height:64px;text-align:center;color:var(--blue);font-size:clamp(25px,2.8vw,44px);font-weight:800;padding-top:15px}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.tab{background:#fff;color:#44677e;border:2px solid #d0e7f5;padding:13px 20px;border-radius:999px;min-height:54px;font-size:clamp(18px,1.5vw,24px);font-weight:700}.tab.active{background:var(--navy);color:#fff;border-color:var(--navy)}.vocab-words{display:grid;gap:14px}.dot{position:absolute;transform:translate(-50%,-50%);width:50px;height:50px;border-radius:50%;border:3px solid #fff;background:#087ac1ed;color:#fff;font-size:22px;font-weight:800;box-shadow:0 2px 12px #123d6345;display:grid;place-items:center}.dot.picked{background:#16805a;box-shadow:0 0 0 9px #fff8}.vocab-caption{position:absolute;left:8%;right:8%;bottom:5%;background:#fffef2f5;color:var(--navy);padding:12px;border-radius:18px;text-align:center;font-size:clamp(25px,3vw,45px);font-weight:800;box-shadow:0 5px 20px #123d6320;pointer-events:none}.concept{display:grid;grid-template-columns:.85fr 1.2fr;gap:40px;align-items:center}.number{font-size:clamp(110px,15vw,250px);font-weight:900;line-height:.9;color:var(--blue)}.concept-label{font-size:clamp(37px,5vw,84px);color:var(--blue);font-weight:900;margin:13px 0}.concept-rule{font-size:clamp(22px,2vw,34px);padding:20px 0;border-top:2px solid var(--line);margin-top:22px}.concept-rule b{color:#16805a}.example{font-size:clamp(27px,3vw,47px);font-weight:800;color:var(--navy);background:#fff;padding:22px;border-radius:20px;min-height:110px;text-align:center;margin-top:20px;animation:rise .3s}.concept .photo{max-height:50vh}.song{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:center}.song-thumb{border-radius:26px;overflow:hidden;background:#122f48;display:block;width:100%;padding:0}.song-thumb img{width:100%;display:block}.song-note{font-size:clamp(22px,2.2vw,34px);line-height:1.5}.listen-note{font-size:17px;color:var(--muted)}.room-stage{width:min(100%,calc((100dvh - 365px)*1.7778));min-width:min(100%,680px);margin:auto}.room-stage .photo{aspect-ratio:16/9}.room-question{font-size:clamp(23px,2.6vw,42px);font-weight:700;color:#244d68;text-align:center;margin:10px auto 18px;min-height:50px}.object-list{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin:16px auto;max-width:1360px}.object-btn{background:#fff;color:var(--navy);border:2px solid #c9e5f5;border-radius:999px;min-height:54px;padding:12px 22px;font-size:clamp(19px,1.5vw,26px);font-weight:700}.object-btn.selected{background:var(--blue);border-color:var(--blue);color:#fff}.pulse{position:absolute;border-radius:50%;width:clamp(26px,3vw,54px);height:clamp(26px,3vw,54px);transform:translate(-50%,-50%);border:4px solid #fff;background:#087ac1a0;box-shadow:0 0 0 10px #087ac12a;pointer-events:none;animation:pulse 1.5s infinite}.hot{position:absolute;transform:translate(-50%,-50%);border:0;border-radius:50%;background:#ffffff08;width:clamp(54px,5.5vw,90px);height:clamp(54px,5.5vw,90px);padding:0}.hot:focus-visible{outline:4px dotted #00a8df}.sentence-bubble{position:absolute;left:20%;right:18%;top:4%;z-index:4;background:#fffffff5;border:3px solid #83d8ff;border-radius:28px;padding:clamp(12px,1.6vw,24px);font-size:clamp(22px,2.6vw,43px);font-weight:800;color:var(--navy);text-align:center;box-shadow:0 6px 24px #154b6b25;line-height:1.24;animation:rise .35s;pointer-events:none}.sentence-bubble:after{content:'';position:absolute;left:48%;bottom:-16px;border-left:15px solid transparent;border-right:15px solid transparent;border-top:17px solid #83d8ff}.sentence-bubble .be{color:#087ac1}.exercise{max-width:1240px;margin:0 auto}.quiz-top{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:18px;font-weight:700;color:var(--muted);margin:12px 0 20px}.quiz-body{display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;align-items:center}.quiz-body .photo{aspect-ratio:4/3;max-height:390px}.quiz-sentence{font-size:clamp(30px,3.6vw,58px);line-height:1.32;font-weight:700}.blank{color:var(--blue);display:inline-block;border-bottom:4px solid #87c9f0;min-width:74px;text-align:center}.choices{display:flex;gap:20px;justify-content:center;margin:30px 0}.choice{min-width:180px;padding:24px 32px;border:3px solid #c2e5fb;border-radius:24px;background:#fff;color:var(--blue);font-size:clamp(34px,4vw,65px);font-weight:800;min-height:105px;transition:transform .2s,background .2s}.choice.text-choice{font-size:clamp(23px,2.1vw,33px);line-height:1.3;text-align:left;width:100%;min-width:0;min-height:100px}.choices.long{flex-direction:column;gap:14px}.choice.picked.good{background:#def8eb;border-color:#26966c;color:#116545}.choice.picked.retry{background:#fff3d6;border-color:#d8af54;color:#805f15}.choice.gone{display:none}.feedback{text-align:center;min-height:56px;font-size:clamp(22px,2vw,32px);font-weight:700;color:#22624b}.feedback.retry{color:#805f15}.quiz-finish{text-align:center;padding:35px;background:#fff;border-radius:30px;margin:20px auto;max-width:1050px}.complete-number{font-size:clamp(70px,10vw,155px);color:var(--blue);font-weight:900}.reading{display:grid;grid-template-columns:.7fr 1.3fr;gap:35px;align-items:start}.text-block{font-size:clamp(23px,2.2vw,36px);line-height:1.6;background:#fff;border-radius:25px;padding:clamp(20px,2.5vw,40px)}.text-block p{font-size:inherit}.grammar-word{color:#0a79b7;font-weight:800}.reveal-questions{display:grid;gap:12px;margin-top:24px}.reveal-row{border:2px solid #d0e8f5;border-radius:20px;background:white;padding:0;overflow:hidden}.question-btn{width:100%;padding:20px 24px;text-align:left;font-size:clamp(22px,2vw,31px);font-weight:700;color:var(--navy);background:#fff}.answer{padding:0 24px 23px;color:#146d4d;font-size:clamp(22px,2vw,30px);line-height:1.4;animation:rise .2s}.writing{display:grid;gap:14px;max-width:1200px;margin:20px auto}.write-row{display:grid;grid-template-columns:65px 1fr;gap:15px;align-items:center;background:#fff;padding:17px 23px;border-radius:22px;border:1px solid #d2e9f7}.write-row label{font-size:30px;font-weight:800;color:var(--blue)}.write-row input{font-size:clamp(23px,2.3vw,36px);padding:15px;width:100%;border:0;border-bottom:2px solid #d3e8f6;color:var(--navy);background:transparent}.write-row input::placeholder{color:#6f8a9f}.share{display:grid;grid-template-columns:1fr 1fr;gap:25px}.role-card{border-radius:30px;background:white;border:2px solid #cae5f6;padding:clamp(22px,3vw,48px)}.role-card.active{background:#e4f6ff;border-color:#0786cc}.role-label{font-size:clamp(28px,3vw,47px);font-weight:800;color:var(--blue)}.timer{font-size:clamp(55px,7vw,100px);font-weight:900;text-align:center;margin:15px}.reflection{display:grid;gap:15px;max-width:1150px;margin:20px auto}.reflect-btn{text-align:left;border:2px solid #cae5f6;border-radius:22px;background:#fff;color:var(--navy);padding:22px 27px;font-size:clamp(24px,2.4vw,36px);font-weight:700}.reflect-btn.active{background:#ddf5e9;border-color:#27916b}.note{font-size:clamp(20px,1.6vw,27px);color:var(--muted);line-height:1.5}.goals{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:28px 0}.goal{padding:25px;border-bottom:5px solid #89d4fd;background:#fff;border-radius:24px}.goal b{display:block;font-size:clamp(24px,2.3vw,39px);color:#087ac1;margin:10px 0}.goal span{font-size:var(--text);line-height:1.4}.menu-overlay{position:fixed;inset:0;background:#0a2c48b8;z-index:60;display:grid;place-items:center;padding:18px}.menu-box{background:#f2f9ff;border-radius:28px;padding:25px;width:min(1100px,100%);max-height:90dvh;overflow:auto}.menu-box h2{display:flex;justify-content:space-between;align-items:center}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.menu-item{padding:19px;text-align:left;font-size:23px;font-weight:700;background:white;color:var(--navy);border-radius:17px;border:2px solid #d2e9f6}.menu-item.active{background:#0b7ac0;color:#fff}.toast{position:fixed;bottom:120px;left:50%;transform:translateX(-50%);background:#123d63;color:#fff;padding:14px 23px;border-radius:16px;font-size:20px;z-index:80;max-width:90%;box-shadow:0 4px 25px #123d6344}.hide{display:none!important}.soft{animation:rise .3s}@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{50%{box-shadow:0 0 0 18px #087ac10a}}@media(min-width:1900px){main{max-width:1880px}.room-stage{min-width:min(100%,1100px)}.word{min-height:90px}.dot{width:66px;height:66px;font-size:29px}.btn{min-height:76px}}@media(max-width:900px){.hero,.split,.concept,.song,.reading,.quiz-body{grid-template-columns:1fr}.hero{min-height:0}.hero-image{max-height:42vh;object-fit:contain}.hero h1{font-size:47px}.house{max-width:min(100%,720px)}.vocab-words{grid-template-columns:repeat(2,1fr)}.concept{gap:20px}.concept .number{font-size:115px;float:left;margin-right:20px}.concept-label{font-size:53px}.concept .photo{max-height:none}.concept-rule{padding:15px 0;margin-top:15px}.room-stage{width:100%;min-width:0}.room-question{font-size:28px}.sentence-bubble{font-size:clamp(17px,3.5vw,29px);padding:10px;left:18%;right:14%;border-radius:19px}.goals{grid-template-columns:1fr 1fr}.quiz-body .photo{aspect-ratio:16/9;max-height:260px}.quiz-sentence{font-size:36px}.share{grid-template-columns:1fr 1fr}.tools{gap:5px}.tool{padding:9px 11px;font-size:15px}.brand small{font-size:10px}.menu-grid{grid-template-columns:1fr 1fr}.reading .photo{max-height:300px}.reading{gap:20px}}@media(max-width:550px){header{padding:10px;align-items:center}.brand{font-size:17px}.brand small{font-size:8px;letter-spacing:.05em}.tool{font-size:13px;padding:9px;min-height:43px}.fullscreen-label{display:none}main{padding:18px 13px}h1{font-size:36px}.hero h1{font-size:43px}.room-list,.goals,.share{grid-template-columns:1fr}.room-choice{font-size:11px;padding:7px 9px;min-height:35px}.word{font-size:23px;padding:13px;min-height:67px}.vocab-words{gap:9px}.dot{width:40px;height:40px;font-size:18px}.tab{font-size:16px;padding:10px 13px}.btn{font-size:19px;padding:13px 19px;min-height:54px}.choices{gap:14px}.choice{min-width:120px;padding:18px;font-size:45px}.quiz-sentence{font-size:31px}.photo{border-radius:18px}.object-btn{font-size:16px;padding:10px 14px;min-height:46px}.sentence-bubble{font-size:17px;left:17%;right:13%;top:3%;padding:9px}.navline{padding:13px;gap:8px}.navline button{min-width:90px;font-size:16px;padding:12px}.counter{font-size:13px}.credit{font-size:11px}.menu-item{font-size:17px;padding:14px}.write-row{grid-template-columns:35px 1fr;padding:12px;gap:4px}.write-row input{font-size:20px;padding:12px}.toast{font-size:16px;bottom:100px}.concept-label{font-size:43px}.room-question{font-size:24px}.hot{width:44px;height:44px}.pulse{width:25px;height:25px}.question-btn{font-size:22px}.text-block{font-size:23px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
body[data-page="room"] main{padding-top:12px;padding-bottom:12px}body[data-page="room"] main>.eyebrow{display:none}body[data-page="room"] main>h1{font-size:clamp(30px,3vw,44px);text-align:center;margin:0 0 5px}body[data-page="room"] .room-question{font-size:clamp(22px,2vw,32px);min-height:0;margin:5px 0 10px}body[data-page="room"] .room-stage{width:min(100%,calc((100dvh - 420px)*1.7778));min-width:0}body[data-page="room"] .object-list{margin:10px auto;gap:8px}body[data-page="room"] .object-btn{min-height:44px;padding:8px 18px;font-size:clamp(17px,1.3vw,24px)}body[data-page="room"] .actions{margin-top:10px;gap:10px}body[data-page="room"] .actions .btn{min-height:48px;padding:10px 22px;font-size:22px}body[data-page="room"] .navline{padding-top:8px;padding-bottom:8px}body[data-page="room"] .navline .btn{min-height:48px;padding:10px 20px;font-size:18px}body[data-page="room"] .credit{padding:5px 12px 10px;font-size:14px}body[data-page="room"] .sentence-bubble{font-size:clamp(18px,2.2vw,36px);padding:clamp(10px,1.3vw,20px)}@media(max-width:550px){body[data-page="room"] .room-stage{width:100%}body[data-page="room"] .sentence-bubble{font-size:17px;padding:9px}body[data-page="room"] .actions .btn{font-size:17px;padding:11px 16px}body[data-page="room"] .credit{font-size:11px}}
@media(min-width:950px) and (max-height:850px){header{padding:8px 24px}.tool{min-height:44px;padding:10px 14px;font-size:16px}main{padding:14px 24px}h1{font-size:36px;margin:6px 0 10px}.eyebrow{font-size:15px}.lead{font-size:21px;margin:8px 0 12px;line-height:1.35}.tabs{margin:10px 0}.tab{min-height:46px;font-size:18px;padding:10px 18px}.navline{padding:8px 24px}.navline .btn{min-height:48px;font-size:18px;padding:10px 20px}.credit{font-size:13px;padding:6px 12px 9px}body[data-page="vocab"] .photo{max-width:min(100%,calc((100dvh - 390px)*1.7778));margin:auto}.house{max-width:min(100%,calc((100dvh - 365px)*1.3333))}.concept .photo{max-height:calc(100dvh - 450px)}.concept .actions{margin-top:12px}.concept .actions .btn{min-height:48px;font-size:20px;padding:12px 20px}.concept .example{min-height:82px;font-size:28px;padding:16px;margin-top:12px}.quiz-body .photo{max-height:calc(100dvh - 460px)}.quiz-sentence{font-size:clamp(28px,2.7vw,38px)}.choices{margin:20px 0}.choice{min-height:88px;font-size:45px;padding:16px 25px}.choice.text-choice{font-size:23px;min-height:90px}.feedback{min-height:40px;font-size:24px}.quiz-body .actions{margin-top:12px}.quiz-body .btn{min-height:48px;font-size:20px;padding:12px 20px}body[data-page="welcome"] h1{font-size:52px}}

header{gap:20px}.brand{cursor:default;user-select:none;-webkit-user-select:none}.tools{flex-wrap:wrap;justify-content:flex-end}.volume-box{display:flex;align-items:center;gap:8px;background:#eff8ff;border:1px solid #cce4f3;border-radius:14px;padding:9px 12px;font-size:16px;font-weight:700}.volume-box input{width:110px;accent-color:#087ac1;cursor:pointer;height:30px}.volume-box output{min-width:43px}.audio-ready{background:#e3f8ec;border-color:#87cfad;color:#126c47}.volume-box input::-webkit-slider-thumb{height:26px;width:26px}.photo.cover img{object-fit:cover}.hero{min-height:54vh}.hero h1{font-size:clamp(42px,4.9vw,77px)}.hero .note{font-size:clamp(20px,1.7vw,27px)}.mini-goals{display:flex;gap:12px;flex-wrap:wrap;margin:18px 0}.mini-goals span{font-size:clamp(18px,1.5vw,24px);color:#145979;background:#e0f1ff;padding:12px 17px;border-radius:15px;font-weight:700}.sound-hint{font-size:17px;color:#557087;margin:14px 0}.compare-layout{display:grid;grid-template-columns:1.3fr .8fr;align-items:center;gap:32px}.compare-pics{display:grid;grid-template-columns:1fr 1fr;gap:18px}.school-card{background:#fff;border:3px solid #d0e7f5;padding:0;border-radius:24px;overflow:hidden;position:relative;box-shadow:0 8px 25px #194a6e12}.school-card img{width:100%;height:min(52vh,470px);object-fit:contain;display:block}.school-card.active{border-color:#1684c7;box-shadow:0 0 0 5px #087ac119}.school-letter{position:absolute;left:14px;bottom:14px;border-radius:50%;background:#087ac1;color:#fff;width:53px;height:53px;font-size:30px;font-weight:800;display:grid;place-items:center}.thought{background:#fff;border-radius:22px;padding:22px;border-left:6px solid #46b4ec;font-size:clamp(23px,2vw,33px);line-height:1.4;margin:20px 0}.review-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px auto}.expression{background:#fff;border:2px solid #c9e5f6;color:#183e5b;padding:24px;border-radius:24px;text-align:left;min-height:150px}.expression b{font-size:19px;color:#087ac1;display:block;letter-spacing:.06em;margin-bottom:14px}.expression span{display:block;font-size:clamp(26px,2.5vw,41px);line-height:1.25;font-weight:700}.expression.speaking,.speech-line.speaking{background:#e1f6ee;border-color:#259b72}.vote-grid{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:30px}.vote-statement{font-size:clamp(27px,2.7vw,45px);font-weight:800;line-height:1.25}.vote-options{display:flex;gap:15px;margin-top:24px}.vote-btn{flex:1;background:#fff;border:3px solid #c1e2f5;border-radius:22px;padding:24px;font-size:clamp(25px,2.7vw,42px);font-weight:800;color:#087ac1}.vote-btn.selected{background:#e1f7ee;border-color:#2b9771;color:#146a49}.vote-btn.think{background:#fff2d7;border-color:#d8b562;color:#765719}.explanation{padding:20px;border-radius:20px;background:white;font-size:clamp(22px,2vw,32px);line-height:1.4;margin-top:18px}.verbs-layout{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}.verbs-list{display:grid;gap:12px}.verb-btn{display:grid;grid-template-columns:150px 1fr;align-items:center;text-align:left;gap:15px;min-height:68px;background:#fff;border:2px solid #cce5f5;border-radius:20px;color:#193e59;padding:15px 20px;font-size:clamp(22px,1.8vw,30px)}.verb-btn b{color:#087ac1;font-size:clamp(25px,2.2vw,36px)}.verb-btn.speaking{background:#ddf6ed;border-color:#24986f}.order-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;margin-top:18px}.order-column{background:#e6f4ff;padding:20px;border-radius:24px;border:2px dashed #abd5ef;min-height:355px}.order-column h2{font-size:25px;margin-bottom:16px}.order-column.source{background:#f8fcff;border-style:solid;border-color:#d1e8f5}.action-card{display:flex;align-items:center;gap:13px;border-radius:17px;background:#fff;border:2px solid #c6e2f4;color:#183e5b;font-size:clamp(22px,1.9vw,31px);font-weight:700;min-height:68px;padding:13px 17px;width:100%;text-align:left;margin-bottom:11px}.card-id{border-radius:50%;width:40px;height:40px;min-width:40px;background:#087ac1;color:white;display:grid;place-items:center;font-size:23px}.action-card:hover{background:#ecf8ff}.selected-row{display:grid;grid-template-columns:42px 1fr auto;gap:9px;align-items:center;background:#fff;border:2px solid #c5e3f4;border-radius:17px;padding:10px 12px;margin-bottom:10px;min-height:68px}.selected-row.ok{border-color:#2b9b71;background:#e3f9ed}.selected-row.change{border-color:#d8b25a;background:#fff5de}.sequence-number{font-size:26px;font-weight:800;color:#087ac1}.selected-text{font-size:clamp(21px,1.8vw,30px);font-weight:700;line-height:1.25}.reorder-tools{display:flex;gap:5px}.tiny-btn{min-width:42px;min-height:44px;padding:8px 10px;background:#e8f5ff;border-radius:12px;color:#174d72;font-weight:800;font-size:22px}.tiny-btn:disabled{opacity:.25}.empty-step{border:2px dashed #b9d9ed;border-radius:17px;height:66px;display:flex;align-items:center;padding:13px;color:#7090a6;font-size:24px;margin-bottom:10px}.order-feedback{font-size:clamp(23px,2.2vw,35px);font-weight:800;text-align:center;min-height:45px;margin:18px 0 12px;color:#11684b}.order-feedback.retry{color:#815d18}.listening-shell{max-width:1180px;margin:0 auto;text-align:center}.listening-shell .lead{margin-left:auto;margin-right:auto}.listening-note{background:#fff;border-radius:24px;padding:24px;margin:20px auto;display:flex;gap:20px;justify-content:center;flex-wrap:wrap;font-size:24px;line-height:1.4}.headphone-mark{width:90px;height:90px;margin:16px auto;border-radius:50%;background:#e0f3ff;display:grid;place-items:center;font-size:47px;color:#087ac1}.listen-controls{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:24px 0}.listen-card{background:#fff;border:2px solid #cae5f7;padding:24px;border-radius:26px}.listen-card.complete{border-color:#2b9871;background:#edfbf4}.listen-card h2{font-size:30px}.listen-card p{font-size:20px}.listen-card .btn{width:100%}.listen-status{min-height:37px;font-size:22px;font-weight:700;margin-top:16px;color:#37617e}.listen-progress{width:100%;height:15px;accent-color:#087ac1;margin-top:15px}.pause-box{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap;margin:20px 0}.pause-time{font-size:40px;font-weight:900;color:#087ac1}.submit-box{background:#e8f4ff;border-radius:24px;padding:22px;margin-top:22px}.confirm-panel{background:#fff4db;border:2px solid #dec481;border-radius:18px;padding:20px;font-size:23px;line-height:1.4}.collected-tag{display:inline-flex;padding:13px 19px;border-radius:999px;background:#dff5e9;font-size:23px;font-weight:700;color:#146848}.answer-panel{background:#fff;border:2px solid #cbe6f6;border-radius:20px;padding:20px;text-align:left;margin:14px 0}.answer-panel b{font-size:24px;color:#164e71}.answer-panel p{font-size:27px;color:#14754d}.assessment-caption{font-size:17px;color:#567487;margin:10px 0}.dialogue-container{max-width:1260px;margin:auto}.model-label{display:inline-block;background:#e0f3ff;padding:11px 18px;border-radius:999px;font-size:19px;color:#087ac1;font-weight:700}.speech-line{display:grid;grid-template-columns:58px 1fr 57px;align-items:center;gap:18px;background:#fff;border:2px solid #cee6f4;border-radius:24px;padding:21px 24px;margin:15px 0;font-size:clamp(25px,2.4vw,40px);line-height:1.3}.speaker{display:grid;place-items:center;width:54px;height:54px;background:#087ac1;border-radius:50%;font-size:28px;font-weight:800;color:#fff}.speaker.b{background:#17825b}.line-replay{width:54px;height:54px;background:#e4f5ff;color:#087ac1;font-size:26px;border-radius:50%;display:grid;place-items:center}.toolkit{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:22px}.toolkit button{background:#fff;color:#154d73;border:2px solid #cce6f6;border-radius:22px;text-align:left;padding:22px;font-size:clamp(22px,2vw,34px);line-height:1.35}.toolkit strong{display:block;font-size:17px;color:#6c879b;letter-spacing:.05em;margin-bottom:10px}.picture-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:22px 0}.picture-choice{border:3px solid #cee6f4;background:#fff;border-radius:27px;padding:0;overflow:hidden;text-align:left;color:#123d63}.picture-choice.selected{border-color:#188acb;box-shadow:0 0 0 6px #087ac117}.picture-choice img{width:100%;height:250px;object-fit:cover;display:block}.picture-choice span{display:block;padding:20px;font-size:26px;line-height:1.35}.picture-choice b{color:#087ac1;display:block;font-size:19px;margin-bottom:9px}.scenario-focus{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center}.scenario-statement{font-size:clamp(28px,2.7vw,45px);line-height:1.25;font-weight:700}.keywords{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:18px 0}.keywords input{width:100%;min-height:63px;border-radius:16px;border:2px solid #c9e4f5;padding:13px;font-size:24px;color:#123d63;background:white}.role-instructions{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}.role-instructions>div{background:#fff;border-radius:23px;padding:24px;border:1px solid #cce5f5}.role-instructions b{color:#087ac1;font-size:28px}.role-instructions p{font-size:24px;margin:12px 0 0}.keyword-count{font-size:18px;color:#54748c;text-align:right}.keyword-count.over{color:#8b651c;font-weight:800}.prepare-clock{text-align:center;font-size:43px;font-weight:900;color:#087ac1;margin-top:12px}.showcase-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:30px;align-items:center}.pair-banner{font-size:clamp(32px,3.6vw,60px);font-weight:900;color:#087ac1}.talk-timer{font-size:clamp(90px,10vw,165px);line-height:1.1;font-weight:900;color:#123d63}.phase-tag{font-size:26px;font-weight:800;color:#177c56;margin:8px 0}.success-list{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin:20px 0}.success-list span{padding:16px;background:#fff;border:1px solid #d0e7f6;border-radius:18px;font-size:24px;font-weight:700}.quiet-notes{background:#fff6dd;border-radius:26px;padding:28px;font-size:24px;line-height:1.5}.quiet-notes h2{font-size:30px}.quiet-notes ol{padding-left:27px}.quiet-notes li{margin:13px 0}.private-box{max-width:1200px}.private-box p,.private-box li{font-size:22px;line-height:1.5}.private-box h2{font-size:28px}.private-box h3{font-size:24px;color:#087ac1}.private-text{background:white;border-radius:18px;padding:22px;font-size:23px;line-height:1.6}.private-rubric{width:100%;border-collapse:collapse;font-size:22px;background:white}.private-rubric th,.private-rubric td{padding:14px;border:1px solid #cee4f2;text-align:left}.plan-list{background:#fff;padding:23px 23px 23px 48px;border-radius:18px}.teacher-hint{font-size:16px;color:#638096;margin-top:18px}.audio-help{background:#fff;border-radius:20px;border:1px solid #cde4f3;padding:20px;font-size:22px;line-height:1.5}.echo-reason{padding:20px;background:#def5eb;border-radius:21px;color:#18644d;font-size:28px;font-weight:700}.finish-photo{width:100%;border-radius:26px}.reflect-layout{display:grid;grid-template-columns:1.1fr 1fr;gap:30px}.reflect-entry{background:#fff;border:2px solid #cee6f4;border-radius:22px;padding:20px;margin-bottom:15px}.reflect-entry label{font-size:19px;font-weight:800;color:#087ac1;display:block;margin-bottom:10px}.reflect-entry textarea{font-size:clamp(24px,2.2vw,36px);border:0;width:100%;resize:vertical;min-height:80px;color:#123d63;line-height:1.35}.reflection .reflect-btn{font-size:25px;padding:20px}.inline-note{font-size:20px;line-height:1.45;color:#59768c}.stop-large{background:#fff;color:#123d63;border:2px solid #bedff3;border-radius:16px;padding:13px 23px;font-size:23px;font-weight:800}.button-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}.school-feedback{min-height:50px}.optional-label{font-size:17px;color:#638198}.cue.speaking{box-shadow:0 0 0 4px #54c59755}.subtle-btn{font-size:20px;background:#eef8ff;color:#1c5a82;padding:14px 20px;border-radius:14px;border:1px solid #cbe3f4}.view-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0}.selected-row.dragging{opacity:.7}.return-hint{font-size:18px;color:#55768d;text-align:center}.block-quote{font-size:clamp(28px,3vw,48px);font-weight:700;line-height:1.3}.logo-caption{font-size:15px;color:#62839c}.current-picture{position:relative}.current-picture img{border-radius:24px}.objective-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0}.objective-row>div{background:#fff;border:1px solid #cee5f3;border-radius:20px;padding:20px}.objective-row b{font-size:22px;display:block;color:#087ac1;margin-bottom:8px}.objective-row span{font-size:22px}.order-done{color:#157a56;font-weight:700;font-size:27px;padding:18px;text-align:center}.task-limit{border-radius:18px;background:#dff3ff;padding:16px 20px;font-size:25px;font-weight:700;color:#0b659c}.confirm-panel .actions{margin-top:15px}.screen-live{font-size:20px;color:#187952;font-weight:700}.listening-shell h1{font-size:clamp(35px,3.6vw,56px)}.reflection .reflect-btn{text-align:left}.order-actions{margin-top:18px}.order-legend{font-size:18px;color:#5b7a91}.footer-meta{font-size:15px;color:#7892a5;text-align:center;margin-top:5px}.grid-controls{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:16px}
@media(min-width:1500px){.school-card img{height:min(52vh,560px)}.listen-card{padding:32px}.selected-row{min-height:80px}.action-card{min-height:80px}.picture-choice img{height:330px}}
@media(min-width:950px) and (max-height:850px){.brand{font-size:22px}.tools{gap:6px}.volume-box{padding:5px 9px;font-size:14px}.volume-box input{width:90px}.tool{font-size:15px;padding:8px 12px}.school-card img{height:calc(100dvh - 310px)}.expression{padding:18px;min-height:125px}.expression span{font-size:28px}.review-cards{gap:13px;margin:16px auto}.verbs-list{gap:8px}.verb-btn{min-height:58px;padding:10px 17px;font-size:22px;grid-template-columns:120px 1fr}.verb-btn b{font-size:27px}.verbs-layout .photo{max-width:min(100%,calc((100dvh - 320px)*1.7778));margin:auto}.order-column{padding:14px;min-height:300px}.order-column h2{font-size:22px;margin-bottom:12px}.action-card{min-height:56px;font-size:22px;padding:9px 13px;margin-bottom:8px}.selected-row{min-height:56px;padding:7px 9px;margin-bottom:8px}.selected-text{font-size:21px}.tiny-btn{min-width:37px;min-height:37px;font-size:19px;padding:6px}.empty-step{height:56px;margin-bottom:8px}.order-feedback{margin:12px 0 8px;font-size:25px;min-height:32px}.order-actions .btn{min-height:48px;font-size:20px;padding:12px 20px}.headphone-mark{width:64px;height:64px;font-size:35px;margin:8px auto}.listening-note{padding:15px;margin:12px auto;font-size:20px;gap:14px}.listen-controls{margin:16px 0;gap:16px}.listen-card{padding:18px}.listen-card h2{font-size:26px}.listen-card p{font-size:18px;margin-bottom:12px}.listen-card .btn{font-size:22px;min-height:53px}.listen-status{font-size:19px;min-height:28px;margin-top:12px}.pause-box{margin:12px 0}.submit-box{padding:16px;margin-top:14px}.submit-box .btn{min-height:48px;font-size:20px;padding:12px 20px}.speech-line{font-size:28px;padding:15px 20px;margin:12px 0;grid-template-columns:48px 1fr 48px}.speaker,.line-replay{width:46px;height:46px}.picture-choice img{height:190px}.picture-choice span{font-size:22px;padding:15px}.role-instructions{margin-top:14px}.role-instructions>div{padding:17px}.role-instructions p{font-size:21px}.keywords input{min-height:53px;font-size:22px;padding:10px}.showcase-layout{gap:20px}.quiet-notes{font-size:21px;padding:22px}.talk-timer{font-size:115px}.success-list span{font-size:21px;padding:12px}.reflect-entry{padding:15px;margin-bottom:12px}.reflect-entry textarea{font-size:27px;min-height:63px}.reflection .reflect-btn{font-size:21px;padding:17px}.objective-row{margin:14px 0}.objective-row>div{padding:16px}.objective-row span{font-size:20px}}
@media(max-width:1000px){header{padding:10px 14px}.brand{font-size:20px}.brand small{font-size:11px}.tools{gap:6px}.volume-box{padding:5px 8px;font-size:14px}.volume-box input{width:75px}.tools .tool{padding:10px 12px;font-size:14px}.compare-layout,.verbs-layout,.vote-grid,.scenario-focus,.showcase-layout,.reflect-layout{grid-template-columns:1fr}.compare-pics{max-width:760px;margin:auto}.school-card img{height:min(42vh,420px)}.review-cards{gap:14px}.expression{padding:20px}.order-layout{gap:15px}.order-column{padding:14px}.selected-text,.action-card{font-size:22px}.card-id{width:35px;height:35px;min-width:35px;font-size:20px}.selected-row{grid-template-columns:30px 1fr;gap:8px}.reorder-tools{grid-column:2;justify-content:flex-end}.verbs-layout .photo{max-height:300px}.vote-grid .photo{max-height:310px}.role-instructions p{font-size:22px}.talk-timer{text-align:center}.pair-banner,.phase-tag{text-align:center}.picture-choice img{height:220px}.picture-choice span{font-size:23px}.model-label{font-size:17px}.speech-line{font-size:27px;padding:17px;gap:13px}.keywords{gap:7px}.keywords input{font-size:21px;padding:10px}.objective-row{grid-template-columns:1fr 1fr 1fr}.objective-row b,.objective-row span{font-size:20px}}
@media(max-width:600px){header{align-items:flex-start;gap:8px;flex-wrap:wrap}.brand{font-size:19px;flex:1;min-width:200px}.brand small{font-size:10px}.tools{width:100%;justify-content:space-between;gap:5px}.tools .tool{font-size:12px;min-height:40px;padding:9px}.volume-box{font-size:12px;gap:5px;min-height:40px}.volume-box input{width:69px;height:24px}.volume-box output{min-width:31px}.hero h1{font-size:43px}.objective-row{grid-template-columns:1fr}.hero{gap:20px}.hero .photo{max-height:270px}.school-card img{height:230px}.compare-pics{gap:10px}.school-letter{width:40px;height:40px;font-size:24px;left:9px;bottom:9px}.thought{font-size:23px;padding:17px}.review-cards{grid-template-columns:1fr}.expression{min-height:110px}.expression span{font-size:28px}.view-tabs{gap:7px}.view-tabs .tab{font-size:16px;padding:10px 13px}.vote-options{gap:10px}.vote-btn{padding:19px 12px;font-size:27px}.vote-statement{font-size:29px}.order-layout{grid-template-columns:1fr}.order-column{min-height:0}.order-column h2{font-size:23px}.action-card{font-size:22px;min-height:64px}.selected-row{grid-template-columns:30px 1fr auto}.reorder-tools{grid-column:auto;flex-direction:column;gap:4px}.selected-text{font-size:21px}.tiny-btn{min-height:34px;min-width:36px;font-size:18px;padding:6px}.selected-row .reorder-tools .tiny-btn:last-child{display:none}.empty-step{height:58px;font-size:21px}.verbs-list{gap:9px}.verb-btn{grid-template-columns:100px 1fr;font-size:20px;min-height:64px;padding:12px 15px;gap:12px}.verb-btn b{font-size:25px}.listen-controls{grid-template-columns:1fr;gap:14px}.listen-card{padding:20px}.listen-card h2{font-size:28px}.listen-card .btn{font-size:22px}.listening-note{font-size:20px;padding:18px;gap:13px}.listening-shell h1{font-size:35px}.pause-box .btn{font-size:18px}.pause-time{font-size:34px}.speech-line{grid-template-columns:42px 1fr;font-size:25px;padding:17px;gap:12px}.speaker{width:40px;height:40px;font-size:23px}.line-replay{grid-column:2;justify-self:end;width:44px;height:44px;font-size:23px}.toolkit,.role-instructions,.picture-choice-grid,.reflect-layout{grid-template-columns:1fr}.picture-choice img{height:200px}.picture-choice span{font-size:24px}.keywords{grid-template-columns:repeat(2,1fr)}.keywords input:last-child{grid-column:1/-1}.task-limit{font-size:21px}.success-list{gap:9px}.success-list span{font-size:20px;padding:13px}.quiet-notes{font-size:22px;padding:22px}.pair-banner{font-size:35px}.talk-timer{font-size:100px}.private-box p,.private-box li{font-size:18px}.private-box h2{font-size:25px}.private-rubric{font-size:17px}.private-rubric td,.private-rubric th{padding:10px}.answer-panel p{font-size:24px}.answer-panel b{font-size:21px}.reflection .reflect-btn{font-size:22px}.brand-header-note{display:none}}
.order-layout.complete{grid-template-columns:1fr;max-width:1260px;margin-left:auto;margin-right:auto}.order-layout.complete .source{display:none}.speech-line{scroll-margin-top:100px}