#writing-view{display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:100%;padding:2rem;box-sizing:border-box}.writing-tool-controls{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center;margin-bottom:2rem}#custom-writing-text-selector{position:relative;min-width:300px;max-width:400px;width:100%}.writing-tool-actions{display:flex;gap:.75rem}.writing-tool-actions button{padding:.75rem 1.5rem;border-radius:12px;border:2px solid var(--border-color);background-color:var(--ht-menu-panel-bg);color:var(--ht-menu-dark-text);font-family:Nunito,sans-serif;font-weight:700;font-size:1rem;cursor:pointer;box-shadow:0 4px 0 0 #e0e8f0;transition:all .2s}.writing-tool-actions button:hover{border-color:var(--active-shadow)}.writing-tool-actions button:active{transform:translateY(4px);box-shadow:none}.writing-tool-content{display:flex;gap:2rem;max-width:900px;align-items:flex-start;overflow-y:auto;padding-bottom:2rem}.writing-tool-left-panel{flex:1;min-width:250px;max-width:50%;background-color:var(--ht-menu-panel-bg);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;box-shadow:0 2px 5px rgba(0,0,0,.05);flex-shrink:1}.writing-paragraph-display{font-size:1.8rem;line-height:2;color:var(--text-color);text-align:left;margin:0}.writing-char-interactive{cursor:pointer;border-bottom:2px dotted var(--selected-blue);transition:background-color .2s;border-radius:3px;padding:0 2px}.writing-char-interactive:hover{background-color:var(--ht-menu-hover-bg)}.writing-char-interactive.highlighted-for-practice{background-color:#ffe0b2;border-color:#ff9800;color:#d35400}.writing-char-interactive.completed-char{background-color:#e6f8d9;border-color:var(--correct-green);color:var(--correct-green)}.writing-tool-right-panel{flex:0 0 350px;max-width:50%;display:flex;flex-direction:column;gap:1rem;align-items:center;flex-shrink:0}#writing-practice-container{display:none;flex-direction:column;justify-content:center;align-items:center;width:100%;gap:1.5rem;padding-bottom:2rem}#anki-writing-svg-container,#lesson-writing-svg-container,#writing-svg-container{max-width:90vw;max-height:90vw;border:2px solid var(--border-color);background-color:#fff;position:relative;touch-action:none;box-shadow:0 4px 8px rgba(0,0,0,.1);border-radius:8px;aspect-ratio:1/1;overflow:hidden}#lesson-writing-svg-container,#writing-svg-container{width:350px;height:350px}#anki-writing-hanzi-svg,#lesson-writing-hanzi-svg,#writing-hanzi-svg{position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:1}#anki-writing-user-canvas,#lesson-writing-user-canvas,#writing-user-canvas{position:absolute;top:0;left:0;width:100%!important;height:100%!important;z-index:2;pointer-events:none}#anki-writing-feedback-overlay,#lesson-writing-feedback-overlay,#writing-feedback-overlay{z-index:3}.writing-component-svg .stroke-guide-faint{fill:#e9ecef!important;stroke:none}.writing-component-svg .stroke-guide-current{fill:var(--selected-blue)!important;stroke:none;animation:writing-pulse 2s infinite}.writing-component-svg .stroke-completed{fill:var(--text-color)!important;stroke:none}.writing-component-svg .stroke-direction-arrow{fill:var(--incorrect-red);animation:writing-pulse 1.5s ease-in-out infinite}@keyframes writing-pulse{0%{opacity:1}50%{opacity:.6}100%{opacity:1}}.writing-practice-container-shared{width:350px;height:350px;max-width:90vw;max-height:90vw;border:2px solid var(--border-color);background-color:#fff;position:relative;touch-action:none;box-shadow:0 4px 8px rgba(0,0,0,.1);border-radius:8px;aspect-ratio:1/1}#writing-view #writing-svg-container{margin:2rem auto}#lesson-writing-hanzi-svg,#writing-hanzi-svg,#writing-tool-hanzi-svg{display:block;width:100%;height:100%}.writing-component-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:block}#lesson-writing-hanzi-svg .practice-grid-line,#writing-hanzi-svg .practice-grid-line{stroke:var(--border-color);stroke-width:2;stroke-dasharray:20,20}.writing-component-svg .stroke-guide-faint{fill:#e9ecef;stroke:none}.writing-component-svg .stroke-guide-current{fill:var(--selected-blue);stroke:none;animation:writing-pulse 2s infinite}.writing-component-svg .stroke-completed{fill:var(--text-color);stroke:none}.writing-svg-container{position:relative;touch-action:none;background-color:#fff;border:1px solid var(--border-color);border-radius:8px}#lesson-writing-hanzi-svg .stroke-completed,#writing-hanzi-svg .stroke-completed{fill:var(--text-color);stroke:none}#lesson-writing-hanzi-svg .stroke-direction-arrow,#writing-hanzi-svg .stroke-direction-arrow{fill:var(--incorrect-red);animation:writing-pulse 1.5s ease-in-out infinite}#lesson-writing-feedback-overlay,#writing-feedback-overlay{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;font-size:8rem;font-weight:900;opacity:0;visibility:hidden;transition:opacity .2s ease-out,visibility .2s ease-out;pointer-events:none;text-shadow:2px 2px 5px rgba(0,0,0,.3)}#lesson-writing-feedback-overlay.visible,#writing-feedback-overlay.visible{opacity:1;visibility:visible}#lesson-writing-feedback-overlay.correct-feedback,#writing-feedback-overlay.correct-feedback{color:var(--correct-green)}#lesson-writing-feedback-overlay.incorrect-feedback,#writing-feedback-overlay.incorrect-feedback{color:var(--incorrect-red)}.current-char-info{text-align:center;background-color:var(--ht-menu-panel-bg);border:1px solid var(--border-color);border-radius:12px;padding:1rem;width:100%;box-shadow:0 2px 5px rgba(0,0,0,.05)}.current-char-pinyin{font-size:1.4rem;color:#777;margin-bottom:.5rem}.current-char-def{font-size:1.1rem;color:var(--ht-menu-primary-color);font-weight:600}@media (max-width:768px){#writing-view{padding:1rem}.writing-tool-controls{flex-direction:column;align-items:stretch;margin-bottom:1.5rem}#custom-writing-text-selector{max-width:100%}.writing-tool-actions{width:100%;justify-content:space-around}.writing-tool-actions button{flex:1;font-size:.9rem;padding:.6rem 1rem}.writing-tool-content{display:flex;flex-direction:column;gap:.75rem;max-width:100%;align-items:center;order:2}.writing-tool-left-panel{width:100%;max-width:350px}.writing-tool-right-panel{flex:none;width:100%;max-width:none;display:flex;flex-direction:column;gap:1.5rem;align-items:center}#writing-svg-container{order:1;width:100%;height:auto;max-width:300px;max-height:300px;margin-top:0;margin-bottom:.7rem}.current-char-info{order:2;width:100%;max-width:350px;padding:0}.writing-paragraph-display{font-size:1.4rem;line-height:1.8;margin:0;width:100%}.current-char-pinyin{font-size:1.2rem}.current-char-def{font-size:1rem}#writing-feedback-overlay{font-size:5rem}}