.english-writing-shell{max-width:920px;margin:0 auto 18px}.english-writing-card{padding:20px}.english-writing-top{display:flex;gap:16px;align-items:flex-start;justify-content:space-between}.english-writing-top h2{margin:4px 0 2px}.english-writing-badge,.english-writing-kind{font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--primary)}.english-writing-counter{font-weight:900;white-space:nowrap}.english-writing-progress{height:7px;background:color-mix(in srgb,var(--primary) 12%,transparent);border-radius:999px;overflow:hidden;margin:14px 0}.english-writing-progress span{display:block;height:100%;background:var(--primary);border-radius:999px}.english-writing-cue{font-size:clamp(24px,4vw,38px);font-weight:900;line-height:1.2;text-align:center;padding:25px 14px 10px}.english-writing-kind{text-align:center;margin-bottom:12px}.english-writing-form{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.english-writing-input{width:min(100%,600px);min-height:48px;border:1px solid var(--border);border-radius:14px;padding:10px 14px;font:inherit;font-size:18px;background:var(--card);color:var(--text);outline:none}.english-writing-input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 18%,transparent)}.english-writing-input.good{border-color:#16a34a}.english-writing-input.bad{border-color:#dc2626}.english-writing-hint{min-height:34px;text-align:center;font-size:20px;font-weight:900;letter-spacing:.08em;padding:8px}.english-writing-feedback{text-align:center;font-weight:900;min-height:36px}.english-writing-answer{font-size:20px;color:var(--primary);margin-top:4px}.english-writing-controls,.english-writing-tools{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap}.english-writing-controls{margin:14px 0 8px}.english-writing-tools{flex:0 0 auto}.english-writing-controls .icon-only-control,.english-writing-tools .icon-only-control{border-radius:50%!important}.english-writing-guide{max-width:920px;margin-inline:auto}
@media(max-width:760px){.english-writing-card{padding:14px}.english-writing-top{align-items:center}.english-writing-top .learning-note{font-size:13px}.english-writing-cue{padding-top:18px}.english-writing-form{display:grid;grid-template-columns:1fr auto}.english-writing-input{grid-column:1/-1;width:100%}.english-writing-tools{grid-column:1/-1}.english-writing-controls{gap:5px}.english-writing-counter{font-size:13px}}
.english-writing-extra{display:flex;align-items:center;justify-content:center;gap:7px;flex-wrap:wrap;margin:0 0 14px}
.english-writing-extra .icon-only-control,.english-writing-extra .title-gesture-control{border-radius:999px}
.english-writing-extra .active{outline:2px solid var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--card))}
.english-writing-search{display:inline-flex;align-items:center;gap:5px}.english-writing-search input{width:170px;min-height:38px;border:1px solid var(--border,var(--line));border-radius:999px;padding:8px 12px;background:var(--card);color:var(--text);font:inherit;font-weight:700;outline:none}.english-writing-search input:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 16%,transparent)}
button.english-writing-counter{border:1px solid var(--border,var(--line));background:var(--card);color:var(--text);border-radius:999px;padding:8px 12px;font-weight:900;white-space:nowrap;min-height:36px}
button.english-writing-counter:active{transform:scale(.96)}
@media(max-width:760px){.english-writing-extra{gap:5px}.english-writing-search{order:10;width:100%;justify-content:center}.english-writing-search input{width:min(78vw,360px)}button.english-writing-counter{font-size:13px}}
