.grammar-page{color:#102b35;background:#f1f5f4;min-height:100vh}.grammar-grid{grid-template-columns:minmax(360px,.9fr) minmax(540px,1.1fr);max-width:1440px;min-height:calc(100vh - 92px);margin:auto;display:grid}.grammar-builder{background:#eef9f8;border-right:1px solid #b9dad8;padding:50px 48px}.grammar-builder>p:first-child{letter-spacing:.18em;color:#087e82;font-size:12px;font-weight:900}.grammar-builder h1{margin:10px 0 24px;font-size:38px}.grammar-rule{background:#fff;border-left:5px solid #14a3a6;gap:7px;padding:18px 20px;display:grid;box-shadow:0 10px 30px #0d555516}.grammar-rule small{color:#677b80;letter-spacing:.12em}.grammar-rule strong{font-size:20px}.grammar-rule span{color:#52656b}.grammar-slots{flex-wrap:wrap;align-items:center;gap:10px;min-height:58px;margin:38px 0 24px;display:flex}.grammar-slots span{background:#fff;border:2px solid #b7cece;border-radius:50%;place-items:center;width:49px;height:49px;font-size:25px;font-weight:800;display:grid}.grammar-slots span.target{border:4px solid #e54747;box-shadow:0 0 0 6px #e5474719}.grammar-slots span.done{background:#d9f5f1;border-color:#10a09e}.grammar-pool{background:#daf1ef;border-radius:18px;flex-wrap:wrap;gap:13px;min-height:68px;padding:16px;display:flex}.grammar-pool button{color:#fff;cursor:grab;background:#11a7aa;border:0;border-radius:50%;width:54px;height:54px;font-size:25px;font-weight:800;box-shadow:0 5px #087a7d}.grammar-pool button.selected{outline:4px solid #f2b84b}.grammar-help{color:#62777c;font-size:13px}.touch-place,.grammar-cycle button{color:#fff;background:#102b35;border:0;border-radius:10px;padding:12px 16px;font-weight:800}.grammar-cycle{gap:10px;margin-top:20px;display:flex}.grammar-input{background:#f8fbfa;padding:34px}.grammar-manuscript{background:#fff;border-top:6px solid #087f83;margin-bottom:14px;padding:20px 22px;box-shadow:0 10px 26px #153a4012}.grammar-manuscript>small{letter-spacing:.13em;color:#6a7d82;font-weight:800}.grammar-manuscript>strong{min-height:38px;margin:9px 0;font-size:24px;display:block}.grammar-manuscript>div{flex-wrap:wrap;gap:8px;display:flex}.grammar-manuscript>div span{border-bottom:2px solid #b7c7ca;place-items:center;width:37px;height:37px;font-size:21px;display:grid}.grammar-manuscript>div span.filled{border-color:#0c9999}.grammar-input .lesson-vk{margin-top:14px}.module-switch{flex-wrap:wrap}@media (width<=900px){.grammar-grid{grid-template-columns:1fr}.grammar-builder{border-bottom:1px solid #b9dad8;border-right:0;padding:30px 22px}.grammar-input{padding:22px 14px}.grammar-builder h1{font-size:30px}.grammar-slots span{width:46px;height:46px}.lesson-page-head{flex-wrap:wrap;gap:14px;height:auto}.module-switch{width:100%}}.super-board>small,.work-zone-label{letter-spacing:.15em;color:#70888d;font-size:10px;font-weight:900}.super-board p{letter-spacing:.18em;color:#087e82;margin:8px 0;font-size:12px;font-weight:900}.function-zone{position:relative}.function-zone>i{letter-spacing:.13em;color:#809398;font-size:9px;font-style:normal;font-weight:900}.answer-zone,.response-zone{padding-top:28px;position:relative}.answer-zone>small,.response-zone>small{letter-spacing:.13em;color:#7c9295;font-size:9px;font-weight:900;position:absolute;top:7px;left:3px}.response-zone>small{left:14px}.work-zone-label{margin:0 0 8px;display:block}.grammar-manuscript{grid-template-columns:1fr 74px;align-items:center;gap:16px;display:grid}.manuscript-content>small{letter-spacing:.13em;color:#6a7d82;font-weight:800}.manuscript-content>strong{min-height:38px;margin:9px 0;font-size:24px;display:block}.typed-slots{flex-wrap:wrap;gap:8px;display:flex}.typed-slots span{border-bottom:2px solid #b7c7ca;place-items:center;width:37px;height:37px;font-size:21px;display:grid}.typed-slots span.filled{border-color:#0c9999}.workspace-controls{justify-items:center;gap:10px;display:grid}.audio-control{color:#0c454e;cursor:pointer;background:#cceff0;border:0;border-radius:50%;width:48px;height:48px;font-size:20px}.audio-control:disabled{opacity:.35;cursor:not-allowed}.question-control{cursor:pointer;background:#cceff0;border-radius:50%;place-items:center;width:48px;height:48px;display:grid;position:relative}.question-control>span{color:#0c6267;font-size:7px;font-weight:900;position:absolute;top:5px}.question-control:after{content:"▼";margin-top:7px;font-size:16px}.question-control select{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.question-control:has(select:disabled){opacity:.35;cursor:not-allowed}.grammar-cycle{display:none}@media (width<=620px){.grammar-manuscript{grid-template-columns:1fr 58px;gap:10px}.audio-control,.question-control{width:46px;height:46px}.super-board h1{font-size:29px}.answer-zone,.response-zone{padding-top:27px}}.sentence-module-page{color:#102b35;background:#f1f5f4;min-height:100vh}.sentence-super-grid{background:#eef9f8;grid-template-columns:minmax(390px,.92fr) minmax(570px,1.08fr);max-width:1440px;overflow:hidden}.sentence-answer-panel{border-right:0;flex-direction:column;min-width:0;padding:46px 48px 38px;display:flex}.sentence-answer-panel .super-board p{margin:0 0 10px}.sentence-answer-panel .super-board h1{margin:0 0 26px;font-size:clamp(32px,3vw,42px);font-weight:500;line-height:1.08}.sentence-function{align-content:center;min-height:112px}.sentence-function strong{font-size:22px}.sentence-function span{font-size:14px;line-height:1.45}.sentence-answer{min-height:58px;margin:36px 0 22px}.sentence-answer>b{font-size:23px;font-weight:500}.sentence-pool{align-items:center;min-height:88px;transition:background .2s}.sentence-pool.waiting:before{content:"Complete the sentence on the right to release the character cards.";color:#789093;font-size:13px;line-height:1.45}.sentence-pool.ready{background:#d6efec}.sentence-answer-panel .grammar-help{margin:12px 0 0;line-height:1.45}.sentence-answer-panel .touch-place{align-self:flex-start;margin-top:14px}.sentence-workspace{background:#f6f0e5;border-left:1px solid #dbe5e1;min-width:0;padding:34px 38px}.sentence-super-grid .writing-sheet{border-radius:20px 20px 0 0;min-height:0;padding:20px 24px 0}.sentence-super-grid .writing-sheet>header{padding-bottom:12px}.single-line{min-height:55px}.single-line:empty{border-bottom:1px solid #dce5e2}.sentence-super-grid .active-sentence{min-height:58px}.sentence-super-grid .structure-display{min-height:82px}.sentence-super-grid .sentence-vk{border-radius:15px;margin-top:12px;padding:14px}@media (width<=1000px){.sentence-super-grid{grid-template-columns:1fr;overflow:visible}.sentence-answer-panel{border-bottom:1px solid #b9dad8;padding:32px 24px}.sentence-workspace{border-left:0;padding:26px 20px 34px}}@media (width<=650px){.sentence-answer-panel{padding:26px 18px}.sentence-answer-panel .super-board h1{font-size:30px}.sentence-function{min-height:96px}.sentence-answer-panel .grammar-slots span{width:44px;height:44px}.sentence-workspace{padding:16px 10px 26px}.sentence-super-grid .writing-sheet{padding:17px 13px 0}}
