*{box-sizing:border-box}html,body{height:100%}body{margin:0;color:var(--pt-ink);background:var(--pt-desk);overflow:hidden}button{border:0;background:none;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}.hidden{display:none!important}
.app{height:100%;padding:12px;display:flex;flex-direction:column;background:var(--pt-desk)}
.topbar{height:58px;max-width:1260px;width:100%;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 4px}.brand{display:flex;align-items:center;gap:9px;}.brand-mark{width:34px;height:34px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);display:grid;place-items:center}.brand-mark svg{width:24px;height:24px}.brand-word{display:block;}.progress{display:flex;gap:6px;align-items:center;background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-sheet);padding:8px 10px;box-shadow:var(--pt-lift)}.dot{width:7px;height:7px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper)}.dot.on{width:22px;background:var(--pt-action)}.right{justify-self:end;display:flex;gap:8px}.round-btn{width:42px;height:42px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);border:1px solid var(--pt-line);display:grid;place-items:center;box-shadow:var(--pt-lift)}.round-btn svg{width:18px;height:18px;stroke:var(--pt-ink);stroke-width:2;fill:none}.round-btn:active{transform:scale(.96)}
.stage{max-width:1260px;width:100%;margin:0 auto;flex:1;min-height:0;background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-sheet);padding:10px;box-shadow:var(--pt-lift);position:relative;overflow:hidden}
.canvas-wrap{height:100%;min-height:0;border-radius:var(--pt-shape-card);background:var(--canvas-paper,var(--pt-paper));border:1px solid var(--pt-line);position:relative;overflow:hidden}
.viewport{position:absolute;inset:0;z-index:0;overflow:hidden;touch-action:none}.canvas-stage{position:absolute;left:0;top:0;width:1280px;height:820px;transform-origin:0 0;will-change:transform}.board-bg{position:absolute;inset:0;background:transparent}canvas{position:absolute;inset:0;width:1280px;height:820px;touch-action:none}.active-board{pointer-events:none}
.canvas-hud{position:absolute;left:18px;top:18px;z-index:7;display:flex;align-items:center;gap:8px}.word-chip{min-height:44px;border:1px solid var(--pt-line);background:var(--pt-paper);backdrop-filter:blur(16px);/* ai-scan-allow: AP-04 既有非设置层样式；画笔/视图的现行 workspace 规则覆盖为 none，纸角抽屉及遮罩无模糊。 */border-radius:var(--pt-shape-key);padding:0 14px;display:flex;align-items:center;gap:9px;box-shadow:var(--pt-lift);}.word-chip .mini-speaker{width:26px;height:26px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;place-items:center}.mini-speaker svg{width:14px;height:14px;stroke:var(--pt-ink);stroke-width:2;fill:none}.hint-trigger{min-width:var(--pt-target-min);min-height:var(--pt-target-min);padding:0 11px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);box-shadow:var(--pt-lift);display:flex;align-items:center;justify-content:center;gap:6px;color:var(--pt-ink-soft);}.hint-trigger svg{width:17px;height:17px;stroke:currentColor;stroke-width:2.1;fill:none}.hint-trigger:active{transform:scale(.97)}.hint-trigger:focus-visible,.hint-close:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}.painting-hint{position:absolute;left:18px;top:70px;z-index:10;display:flex;align-items:center;gap:8px;width:min(310px,calc(100% - 36px));padding:8px 8px 8px 12px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key);background:var(--pt-paper);box-shadow:var(--pt-lift);color:var(--pt-ink-soft);opacity:0;transform:translateY(-6px);visibility:hidden;pointer-events:none;transition:opacity var(--kid-motion-fast) ease,transform var(--kid-motion-fast) ease}.painting-hint.show{opacity:1;transform:translateY(0);visibility:visible}.painting-hint.show .hint-close{pointer-events:auto}.painting-hint-copy{min-width:0;display:flex;align-items:flex-start;gap:7px;flex:1}.painting-hint-copy svg{flex:0 0 auto;width:16px;height:16px;margin-top:1px;stroke:var(--pt-ink-soft);stroke-width:2;fill:none}.painting-hint-copy span{overflow-wrap:anywhere}.hint-close{width:var(--pt-target-min);height:var(--pt-target-min);margin:-4px -4px -4px 0;border-radius:var(--pt-shape-key-sm);display:grid;place-items:center;color:var(--pt-ink-soft);flex:0 0 auto}.hint-close svg{width:17px;height:17px;stroke:currentColor;stroke-width:2.2;fill:none}.hint-close:active{transform:scale(.97)}
.view-dock{position:absolute;top:18px;right:18px;z-index:7;display:flex;gap:8px;padding:8px;background:var(--pt-paper);backdrop-filter:blur(16px);/* ai-scan-allow: AP-04 既有非设置层样式；画笔/视图的现行 workspace 规则覆盖为 none，纸角抽屉及遮罩无模糊。 */border:1px solid var(--pt-line);border-radius:var(--pt-shape-key);box-shadow:var(--pt-lift)}.view-pill{min-width:56px;padding:0 10px;height:34px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;place-items:center;color:var(--pt-ink-soft)}.view-btn{width:34px;height:34px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;place-items:center}.view-btn svg{width:16px;height:16px;stroke:var(--pt-ink);stroke-width:2;fill:none}.view-btn:active{transform:scale(.97)}
.finish-wrap{position:absolute;right:22px;bottom:24px;z-index:8}.finish{position:relative;width:56px;height:56px;border-radius:var(--pt-shape-card);background:var(--pt-paper);color:var(--pt-ink-soft);box-shadow:var(--pt-lift);display:grid;place-items:center;transition:opacity var(--kid-motion-fast) ease,transform var(--kid-motion-mid) ease,box-shadow var(--kid-motion-mid) ease}.finish:disabled{opacity:.34;filter:saturate(.35);cursor:default}.finish:not(:disabled):active{transform:scale(.97)}.finish svg{width:21px;height:21px;stroke:var(--pt-ink);stroke-width:2.5;fill:none}.finish-icon{display:grid;place-items:center}.finish-label,.finish-arrow{display:none}.finish:focus-visible,.toolbar-handle:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}
.coach{position:absolute;left:50%;top:18px;z-index:9;padding:9px 14px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);color:var(--pt-ink-soft);opacity:0;transform:translate(-50%,-7px) scale(.98);pointer-events:none;transition:opacity var(--kid-motion-mid),transform var(--kid-motion-mid)}.coach.show{opacity:1;transform:translate(-50%,0) scale(1)}
.canvas-wrap.drawing-ui .canvas-hud,.canvas-wrap.drawing-ui .painting-hint,.canvas-wrap.drawing-ui .finish-wrap,.canvas-wrap.drawing-ui .view-dock{opacity:.12;transform:translateY(4px);pointer-events:none}.canvas-hud,.painting-hint,.view-dock,.finish-wrap{transition:opacity var(--kid-motion-fast) ease,transform var(--kid-motion-fast) ease}
/* ai-scan-allow: AP-04 既有启动 loading 层短暂模糊，非纸角设置遮罩；本轮不重做启动层。 */
.loading{position:absolute;inset:0;z-index:20;background:var(--pt-paper);backdrop-filter:blur(5px);display:none;place-items:center}.loading.show{display:grid}.wait{height:44px;min-width:78px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);display:flex;align-items:center;justify-content:center;gap:7px}.wait i{width:7px;height:7px;border-radius:var(--pt-shape-round);background:var(--pt-ink-soft);animation:bob var(--kid-motion-loop-fast) infinite ease-in-out}.wait i:nth-child(2){animation-delay:var(--kid-motion-fast)}.wait i:nth-child(3){animation-delay:var(--kid-motion-mid)}@keyframes bob{0%,60%,100%{transform:translateY(0);opacity:.55}30%{transform:translateY(-4px);opacity:1}}
.overlay{position:fixed;inset:0;background:rgba(31,42,48,.28);opacity:0;pointer-events:none;transition:opacity var(--kid-motion-mid) ease;z-index:30}.overlay.show{opacity:1;pointer-events:auto}
.word-pop,.result-modal,.confirm-modal,.panel,.sheet{position:fixed;left:50%;top:50%;transform:translate(-50%,-46%) scale(.985);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);opacity:0;pointer-events:none;transition:opacity var(--kid-motion-mid),transform var(--kid-motion-mid),visibility var(--kid-motion-mid)}.word-pop.show,.result-modal.show,.confirm-modal.show,.sheet.show{opacity:1!important;pointer-events:auto!important;transform:translate(-50%,-50%) scale(1)!important}
.word-pop{z-index:42;width:min(386px,calc(100vw - 28px));border-radius:var(--pt-shape-sheet);padding:22px 22px 20px}.word-mark{width:68px;height:68px;border-radius:var(--pt-shape-round);margin:0 auto 14px;background:var(--pt-paper);border:1px solid var(--pt-line);display:grid;place-items:center;color:var(--pt-ink-soft);transform:rotate(-2deg)}.word-title{display:flex;justify-content:center;align-items:center;gap:8px}.word-main{text-align:center;}.word-hear-icon{width:46px;height:46px;border-radius:var(--pt-shape-key);background:var(--pt-paper);display:grid;place-items:center;color:var(--pt-ink-soft)}.word-hear-icon svg,.word-slow svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2.2}.word-hear-icon:focus-visible,.word-slow:focus-visible,.start:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}.word-meaning{text-align:center;margin-top:10px}.word-prompt{margin:10px auto 0;max-width:300px;padding:9px 11px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);text-align:left}.word-audio-status{min-height:18px;margin-top:8px;text-align:center;color:var(--pt-ink-soft);}.word-actions{display:flex;gap:9px;margin-top:10px}.word-actions button{height:50px;border-radius:var(--pt-shape-key);}.word-slow{width:98px;background:var(--pt-paper);display:flex;align-items:center;justify-content:center;gap:6px;color:var(--pt-ink-soft);}.start{flex:1;background:var(--pt-ink);color:var(--pt-ink-soft)}
.confirm-modal{z-index:44;width:min(440px,calc(100vw - 28px));max-height:calc(100vh - 32px);overflow:auto;border-radius:var(--pt-shape-sheet);padding:20px}.confirm-preview{aspect-ratio:16/10;border-radius:var(--pt-shape-card);background:var(--pt-paper);border:1px solid var(--pt-line);overflow:hidden;display:grid;place-items:center}.confirm-preview img{width:100%;height:100%;object-fit:contain}.confirm-word{margin-top:16px;}.confirm-desc{margin-top:7px;color:var(--pt-ink-soft);overflow-wrap:anywhere}.confirm-quota{margin-top:14px;padding:10px 12px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);}.confirm-quota.unavailable{background:var(--pt-paper);color:var(--pt-ink-soft)}.confirm-error{min-height:18px;margin-top:9px;color:#b23a2c;}.confirm-actions{display:flex;gap:10px;margin-top:14px}.confirm-actions button{height:48px;border-radius:var(--pt-shape-key);}.confirm-back{flex:1;background:var(--pt-paper);color:var(--pt-ink-soft)}.confirm-submit{flex:1.3;background:var(--pt-ink);color:var(--pt-ink-soft)}.confirm-actions button:disabled{opacity:.48;cursor:not-allowed}
.generation-direction{min-width:0;margin:14px 0 0;padding:0;border:0}.generation-direction legend{padding:0;color:var(--pt-ink-soft);}.direction-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:7px}.direction-option{position:relative;min-width:0;min-height:62px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key);background:var(--pt-paper);color:var(--pt-ink-soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}.direction-option input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.direction-option svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.direction-option:has(input:checked){border-color:var(--pt-action);background:var(--pt-paper);color:var(--pt-ink)}.direction-option:has(input:focus-visible){outline:3px solid var(--pt-ink);outline-offset:2px}.direction-option:has(input:disabled){opacity:.5;cursor:not-allowed}.direction-option:has(input:disabled) input{cursor:not-allowed}
.generation-state{display:grid;justify-items:center;gap:9px;margin-top:18px;padding:18px 14px;border-radius:var(--pt-shape-key);background:var(--pt-paper);color:var(--pt-ink-soft);text-align:center;}.generation-state[hidden]{display:none}.generation-state-icon{width:42px;height:42px;border-radius:var(--pt-shape-key);background:var(--pt-paper);color:var(--pt-ink-soft);display:grid;place-items:center}.generation-state-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.generation-state-icon.waiting{background:var(--pt-paper);color:var(--pt-ink-soft)}.generation-state-icon.disabled{background:var(--pt-paper);color:var(--pt-ink-soft)}.generation-state-copy{max-width:28ch}.confirm-modal[data-generation-state="available"] .confirm-state,.confirm-modal[data-generation-state="available"] .confirm-retry{display:none}.confirm-modal[data-generation-state="checking"] .generation-direction,.confirm-modal[data-generation-state="checking"] .confirm-quota,.confirm-modal[data-generation-state="checking"] .confirm-error,.confirm-modal[data-generation-state="checking"] .confirm-submit,.confirm-modal[data-generation-state="checking"] .confirm-retry,.confirm-modal[data-generation-state="submitting"] .generation-direction,.confirm-modal[data-generation-state="submitting"] .confirm-quota,.confirm-modal[data-generation-state="submitting"] .confirm-error,.confirm-modal[data-generation-state="submitting"] .confirm-submit,.confirm-modal[data-generation-state="submitting"] .confirm-retry,.confirm-modal[data-generation-state="disabled"] .generation-direction,.confirm-modal[data-generation-state="disabled"] .confirm-quota,.confirm-modal[data-generation-state="disabled"] .confirm-error,.confirm-modal[data-generation-state="disabled"] .confirm-submit,.confirm-modal[data-generation-state="disabled"] .confirm-retry,.confirm-modal[data-generation-state="transient"] .generation-direction,.confirm-modal[data-generation-state="transient"] .confirm-quota,.confirm-modal[data-generation-state="transient"] .confirm-error,.confirm-modal[data-generation-state="transient"] .confirm-submit{display:none}.confirm-modal[data-generation-state="checking"] .confirm-actions,.confirm-modal[data-generation-state="submitting"] .confirm-actions{display:none}.confirm-modal[data-generation-state="disabled"] .confirm-back,.confirm-modal[data-generation-state="transient"] .confirm-back{flex:1}.confirm-retry{flex:1;background:var(--pt-paper);color:var(--pt-ink-soft)}
.result-modal{z-index:44;width:min(1060px,calc(100vw - 24px));max-height:calc(100vh - 30px);overflow:auto;border-radius:var(--pt-shape-sheet)}.modal-head{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.close{width:40px;height:40px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;place-items:center}.close svg{width:18px;height:18px;stroke:var(--pt-ink);stroke-width:2;fill:none}.results{padding:0 20px 14px;display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.result{border:2px solid transparent;background:var(--pt-paper);border-radius:var(--pt-shape-card);padding:9px;text-align:left;transition:border-color var(--kid-motion-fast),background-color var(--kid-motion-fast),filter var(--kid-motion-fast),translate var(--kid-motion-fast);position:relative}.result.selected{border-color:var(--pt-action);background:var(--pt-paper)}.preview{aspect-ratio:1;border-radius:var(--pt-shape-key);display:grid;place-items:center;overflow:hidden;position:relative}.preview img{width:82%;height:82%;object-fit:contain;mix-blend-mode:multiply}.preview.sticker{background:var(--pt-paper)}.preview.sticker img{filter:drop-shadow(0 7px 0 #fff) drop-shadow(0 0 2px #fff) saturate(1.2)}.preview.clay{background:var(--pt-paper)}.preview.clay img{filter:drop-shadow(0 12px 15px rgba(77,66,91,.14)) saturate(.92) contrast(1.04)}.preview.book{background:var(--pt-paper)}.preview.book:after{content:"";position:absolute;inset:0;opacity:.10;background:var(--pt-paper)}.preview.book img{filter:sepia(.1) saturate(.85) contrast(.95)}.result-name{padding:10px 6px 5px}.select-dot{position:absolute;right:17px;top:17px;width:18px;height:18px;border-radius:var(--pt-shape-round);background:var(--pt-paper);border:2px solid var(--pt-line);z-index:3}.selected .select-dot{border:5px solid var(--pt-action)}.modal-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 20px 20px}.foot-left{display:flex;gap:8px}.soft,.choose,.save-share{height:46px;border-radius:var(--pt-shape-key);padding:0 16px;}.soft{background:var(--pt-paper);color:var(--pt-ink-soft)}.save-share{background:var(--pt-paper);color:var(--pt-ink-soft)}.choose{min-width:112px;background:var(--pt-ink);color:var(--pt-ink-soft)}.choose:disabled{opacity:.35}
.panel{z-index:46;left:auto;right:12px;top:12px;bottom:12px;transform:translateX(calc(100% + 24px));width:min(430px,calc(100vw - 24px));border-radius:var(--pt-shape-sheet);display:flex;flex-direction:column}.panel.show{opacity:1!important;pointer-events:auto!important;transform:none!important}.panel-head{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--pt-line)}.panel-tabs{display:flex;gap:8px;padding:12px 16px 0}.ptab{height:38px;padding:0 14px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);}.ptab.active{background:var(--pt-paper);color:var(--pt-ink-soft)}.panel-body{padding:14px 16px 16px;overflow:auto;display:grid;gap:12px}.pane{display:none;gap:12px}.pane.active{display:grid}.section{border:1px solid var(--pt-line);border-radius:var(--pt-shape-card);padding:16px}.section-title{margin-bottom:12px;color:var(--pt-ink-soft)}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0}.setting-main{display:grid;gap:4px}.setting-name{color:var(--pt-ink-soft)}.setting-sub,.hint{color:var(--pt-ink-soft)}.compact-select,.input{min-width:130px;height:40px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);padding:0 12px;}.input{width:100%}.stack{display:grid;gap:10px}.field{display:grid;gap:7px}.label{color:var(--pt-ink-soft)}.switch{width:42px;height:25px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);padding:3px;transition:background-color var(--kid-motion-fast),filter var(--kid-motion-fast),translate var(--kid-motion-fast)}.switch i{display:block;width:19px;height:19px;border-radius:var(--pt-shape-round);background:var(--pt-paper);transition:transform var(--kid-motion-fast);box-shadow:var(--pt-lift)}.switch.on{background:var(--pt-action)}.switch.on i{transform:translateX(17px)}
.sheet{z-index:48;width:min(470px,calc(100vw - 28px));border-radius:var(--pt-shape-sheet)}.sheet-head{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--pt-line)}.sheet-body{padding:16px}.sheet-grid{display:grid;gap:10px}.action{height:58px;border-radius:var(--pt-shape-key);background:var(--pt-paper);border:1px solid var(--pt-line);display:flex;align-items:center;justify-content:space-between;padding:0 16px;text-align:left}.action span{color:var(--pt-ink-soft);}.sheet-note{color:var(--pt-ink-soft);padding:12px 4px 2px}
.toast{position:fixed;left:50%;bottom:22px;z-index:60;transform:translate(-50%,14px);opacity:0;pointer-events:none;background:var(--pt-ink);color:var(--pt-paper);border-radius:var(--pt-shape-sheet);padding:10px 15px;transition:opacity var(--kid-motion-mid),transform var(--kid-motion-mid)}.toast.show{opacity:1;transform:translate(-50%,0)}
/* V2.6.1 refinements */
.word-chip{padding:0 13px 0 10px;gap:8px;border-radius:var(--pt-shape-key);background:var(--pt-paper)}
.word-chip .book-icon{width:28px;height:28px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;place-items:center}
.word-chip .book-icon svg{width:15px;height:15px;stroke:var(--pt-ink);stroke-width:2;fill:none}
.word-chip .book-count{color:var(--pt-ink-soft);margin-left:2px}
.view-dock{background:transparent;border:0;box-shadow:none;padding:0;gap:6px;backdrop-filter:none}
.view-pill{background:transparent;min-width:48px;padding:0 4px;color:var(--pt-ink-soft)}
/* ai-scan-allow: AP-04 既有视图键模糊，仅在家长视图中；纸角四宫格覆盖为 none，不扩大清理范围。 */
.view-btn{width:36px;height:36px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);backdrop-filter:blur(12px)}
.view-btn:hover{background:var(--pt-paper)}.view-btn:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}.view-btn.new-paper{color:var(--pt-ink);background:var(--pt-paper-deep);border-color:var(--pt-line)}.view-btn.new-paper svg{stroke:currentColor}
.wordbook-modal{position:fixed;left:50%;top:50%;z-index:43;width:min(760px,calc(100vw - 28px));max-height:calc(100vh - 34px);overflow:auto;background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-sheet);box-shadow:var(--pt-lift);opacity:0;pointer-events:none;transform:translate(-50%,-46%) scale(.985);transition:opacity var(--kid-motion-mid),transform var(--kid-motion-mid),visibility var(--kid-motion-mid)}
.wordbook-modal.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.wordbook-head{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--pt-line)}.wb-actions{display:flex;gap:8px;align-items:center}
.wordbook-title{display:flex;align-items:center;gap:10px;}.wordbook-title svg{width:21px;height:21px;stroke:var(--pt-ink);stroke-width:2;fill:none}
.wordbook-sub{color:var(--pt-ink-soft);margin-left:6px}
.wordbook-body{padding:18px 20px 22px}.wordbook-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.word-card{position:relative;min-height:168px;border-radius:var(--pt-shape-card);background:var(--pt-paper);border:1px solid var(--pt-line);padding:10px;text-align:left;transition:background-color var(--kid-motion-fast),border-color var(--kid-motion-fast),box-shadow var(--kid-motion-fast),transform var(--kid-motion-fast),filter var(--kid-motion-fast),translate var(--kid-motion-fast);overflow:hidden}
.word-card.current{border-color:var(--pt-line);background:var(--pt-paper);box-shadow:var(--pt-lift)}
/* ai-scan-allow: AP-11 既有单词卡 hover 仅 2px、非默认画板；保持旧交互，本轮不重做单词本。 */
.word-card.done{background:var(--pt-paper)}.word-card:not(.done):not(.current){cursor:pointer}.word-card:not(.done):not(.current):hover{transform:translateY(-2px);box-shadow:var(--pt-lift)}
.word-thumb{height:112px;border-radius:var(--pt-shape-key);background:var(--pt-paper);display:grid;place-items:center;overflow:hidden;border:1px solid var(--pt-line)}.word-thumb img{width:100%;height:100%;object-fit:contain}.word-q{color:var(--pt-ink-soft)}
.word-card-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 3px 2px}.word-status{border-radius:var(--pt-shape-sheet);padding:5px 7px;background:var(--pt-paper);color:var(--pt-ink-soft);}.word-card.current .word-status{background:var(--pt-paper);color:var(--pt-ink-soft)}.word-card.done .word-status{background:var(--pt-paper);color:var(--pt-ink-soft)}
.wordbook-tip{margin-top:14px;color:var(--pt-ink-soft);text-align:center}
@media (max-width:760px){.wordbook-grid{grid-template-columns:repeat(2,1fr)}.word-card{min-height:150px}.word-thumb{height:96px}}
/* V3.0 Cloudflare production */
.backend-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key);background:var(--pt-paper);margin-bottom:12px}.backend-left{display:flex;align-items:center;gap:9px;min-width:0}.backend-dot{width:9px;height:9px;border-radius:var(--pt-shape-round);background:var(--pt-paper);box-shadow:var(--pt-lift);flex:0 0 auto}.backend-dot.ok{background:var(--pt-paper);box-shadow:var(--pt-lift)}.backend-dot.bad{background:var(--pt-paper);box-shadow:var(--pt-lift)}.backend-copy{display:grid;gap:2px;min-width:0}.backend-copy span{color:var(--pt-ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}.mini-action{height:34px;padding:0 11px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);flex:0 0 auto}.mini-action.danger{background:var(--pt-paper);color:var(--pt-ink-soft)}.provider-actions{display:flex;gap:8px;margin-top:12px}.provider-actions button{height:42px;border-radius:var(--pt-shape-key-sm);padding:0 14px;}.provider-save{flex:1;background:var(--pt-ink);color:var(--pt-paper)}.provider-test{background:var(--pt-paper);color:var(--pt-ink-soft)}.provider-remove{background:var(--pt-paper);color:var(--pt-ink-soft)}.api-note{color:var(--pt-ink-soft);margin-top:10px}.usage-line{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.usage-chip{padding:10px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);display:grid;gap:2px}.usage-chip span{color:var(--pt-ink-soft);}.result-error{aspect-ratio:1;border-radius:var(--pt-shape-key);background:var(--pt-paper);border:1px dashed var(--pt-line);display:grid;place-items:center;text-align:center;padding:18px;color:var(--pt-ink-soft);}.busy-copy{position:absolute;left:50%;top:50%;transform:translate(-50%,42px);z-index:21;color:var(--pt-ink-soft);}.action.disabled{opacity:.42;pointer-events:none}.backend-banner{position:absolute;left:50%;top:72px;z-index:10;transform:translateX(-50%);display:none;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);border:1px solid var(--pt-line);color:var(--pt-ink-soft);box-shadow:var(--pt-lift)}.backend-banner.show{display:flex}.backend-banner button{color:var(--pt-ink-soft)}.result-provider{color:var(--pt-ink-soft);padding:0 6px 7px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}.status-tag{border-radius:var(--pt-shape-sheet);padding:5px 8px;background:var(--pt-paper);color:var(--pt-ink-soft)}.status-tag.ok{background:var(--pt-paper);color:var(--pt-ink-soft)}.status-tag.warn{background:var(--pt-paper);color:var(--pt-ink-soft)}
@media (max-width:900px){.results{grid-template-columns:1fr}.finish-wrap{right:14px;bottom:18px;padding:6px;border-radius:var(--pt-shape-card)}.finish{min-width:112px;height:52px;padding:0 16px;border-radius:var(--pt-shape-key)}.view-dock{right:14px;top:14px}.view-pill{display:none}}
.left-handed .finish-wrap{right:auto;left:22px}.left-handed .view-dock{right:auto;left:18px}.finish{min-width:56px;padding:0}.word-pop{top:50%;left:50%;max-width:calc(100vw - 28px)}.word-desc{overflow-wrap:anywhere;word-break:break-word}.confirm-modal:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}
@media (max-width:480px){.word-pop,.confirm-modal{width:calc(100vw - 28px);max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 28px)}.word-pop{padding:20px}.word-desc{max-width:100%}.confirm-modal{padding:16px}.confirm-actions{position:sticky;bottom:0;padding-top:10px;background:var(--pt-paper)}.finish-wrap{right:max(14px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}.finish{width:52px;min-width:52px;height:52px;border-radius:var(--pt-shape-key)}}
/* Phase 2: mobile control density keeps canvas actions in independent slots. */
.view-controls{display:flex;align-items:center;gap:8px}.view-trigger,.view-btn-label,.view-close{display:none}
@media (min-width:641px){.canvas-hud{left:var(--pt-hud-inset);top:var(--pt-hud-inset)}.view-dock{top:var(--pt-hud-inset);right:var(--pt-hud-inset)}}
@media (max-width:640px),(max-height:520px) and (orientation:landscape){.app{height:100dvh;min-height:100dvh;padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))}}
@media (max-width:900px){
}
@media (max-width:900px),(max-height:520px) and (orientation:landscape){.color-wrap{width:var(--pt-target-min);height:var(--pt-target-min);flex:0 0 var(--pt-target-min)}}
@media (max-width:640px){
.app{min-width:0}
.topbar{height:auto;min-height:96px;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand actions" "progress progress";gap:8px;padding:0 2px 8px}
.brand{grid-area:brand;min-width:0}.brand-word{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress{grid-area:progress;justify-self:center;max-width:100%}.right{grid-area:actions}.right .round-btn{width:var(--pt-target-min);height:var(--pt-target-min)}
.stage{padding:8px;border-radius:var(--pt-shape-card)}.canvas-wrap{border-radius:var(--pt-shape-card)}
.canvas-hud{left:max(12px,env(safe-area-inset-left));top:12px;max-width:calc(100% - 106px)}.word-chip{min-height:var(--pt-target-min);min-width:0;overflow:hidden}.word-chip #chipWord{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hint-trigger{flex:0 0 var(--pt-target-min);width:var(--pt-target-min);padding:0}.hint-trigger span{display:none}.painting-hint{left:max(12px,env(safe-area-inset-left));top:calc(var(--pt-target-min) + 20px);width:min(272px,calc(100% - 32px))}
.coach{top:122px;max-width:calc(100% - 32px);text-align:center}
.view-dock{top:12px;right:max(12px,env(safe-area-inset-right));padding:0;border:0;background:transparent;box-shadow:none}.view-trigger{display:flex;align-items:center;justify-content:center;min-width:var(--pt-target-min);min-height:var(--pt-target-min);padding:0 12px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);color:var(--pt-ink-soft)}
/* ai-scan-allow: AP-04 既有手机视图分支，workspace 家长视图覆盖为静态块；新设置抽屉及遮罩不用 blur。 */
.view-controls{display:none;position:absolute;right:0;top:calc(var(--pt-target-min) + 8px);width:min(272px,calc(100vw - 32px));padding:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-key);box-shadow:var(--pt-lift);backdrop-filter:blur(16px)}.view-dock.open .view-controls{display:grid}.view-pill{display:flex;grid-column:span 2;min-height:var(--pt-target-min);}.view-btn{width:auto;min-width:0;height:48px;border-radius:var(--pt-shape-key-sm);display:flex;align-items:center;justify-content:flex-start;gap:8px;padding:0 12px}.view-btn-label{display:inline;}.view-close{display:block;grid-column:span 2;min-height:var(--pt-target-min);border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);}
.finish-wrap{right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));padding:6px;border-radius:var(--pt-shape-card)}.finish{width:56px;min-width:56px;height:56px;border-radius:var(--pt-shape-key)}.left-handed .finish-wrap{right:auto;left:max(12px,env(safe-area-inset-left))}.left-handed .view-dock{right:auto;left:max(12px,env(safe-area-inset-left))}.left-handed .canvas-hud{left:auto;right:max(12px,env(safe-area-inset-right))}.left-handed .painting-hint{left:auto;right:max(12px,env(safe-area-inset-right))}
}
/* 作画间隙保留入口；只有落笔中的 drawing-ui 退场。 */
.drawing-feel{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:2}
.drawing-feel[hidden],.drawing-feel [hidden],.stroke-feedback-outline[hidden]{display:none!important}
.drawing-feel circle{fill:none;stroke:var(--pt-ink-soft);opacity:.55}
.drawing-feel circle.erasing{fill:var(--pt-paper);stroke:var(--pt-ink);opacity:.8}
.drawing-feel path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.stroke-feedback-outline.feedback-success circle{fill:var(--pt-paper);stroke:var(--pt-ink-soft);stroke-dasharray:none}
.brush-size-sample{display:block;margin:auto;max-width:100%;overflow:visible}
.brush-size-sample path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.size-presets,.feel-options{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.size-presets button,.feel-options button{min-height:48px;min-width:48px;border:1px solid var(--pt-line);border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);}
.size-presets button{display:grid;place-items:center}.size-presets i{display:block;background:currentColor;border-radius:var(--pt-shape-round)}
.size-presets button[aria-pressed="true"],.feel-options button[aria-pressed="true"]{background:var(--pt-paper);border-color:var(--pt-ink-soft)}
#sizeOptions .size-group{flex-wrap:wrap;justify-content:center}#brushSizeSample,.size-presets{flex-basis:100%}
#drawingFeelOptions{margin-top:12px}#drawingFeelOptions summary{min-height:48px}#drawingFeelStatus{color:var(--pt-ink-soft)}
button:active{filter:brightness(.96)}
@media(prefers-reduced-motion:no-preference){button:active{translate:0 1px}}
/* V0.1 AI 看看 + 按住说（Demo v0.2 已拍板；docs/10-cliproxyapi-experiment.md） */
.finish-wrap{display:flex;align-items:center;gap:10px}
.ai-look{display:flex;align-items:center;gap:8px;height:52px;padding:0 18px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);border:1.5px solid var(--pt-paper-deep);color:var(--pt-ink-soft);box-shadow:var(--pt-lift);cursor:pointer;transition:transform var(--kid-motion-fast) ease,box-shadow var(--kid-motion-fast) ease}
.ai-look:active{transform:translateY(3px);box-shadow:var(--pt-lift)}
.ai-look svg{width:20px;height:20px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.ai-look:focus-visible{outline:3px solid var(--pt-ink);outline-offset:3px}
.finish{box-shadow:var(--pt-lift)}
.finish:not(:disabled):active{transform:translateY(3px);box-shadow:var(--pt-lift)}
.mic-wrap{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);display:grid;place-items:center;z-index:9}
.mic{position:relative;width:72px;height:72px;border-radius:var(--pt-shape-round);background:var(--pt-ink);color:var(--pt-ink-soft);display:grid;place-items:center;box-shadow:var(--pt-lift);cursor:pointer;touch-action:none;transition:transform var(--kid-motion-fast) ease,box-shadow var(--kid-motion-fast) ease}
.mic svg{width:29px;height:29px;stroke:currentColor;fill:none;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.mic.listening{transform:scale(1.12);box-shadow:var(--pt-lift)}
.mic:focus-visible{outline:3px solid var(--pt-paper-deep);outline-offset:3px}
.mic-ring{position:absolute;inset:0;border-radius:var(--pt-shape-round);border:3px solid var(--pt-ink);opacity:0;pointer-events:none}
/* ai-scan-allow: MO-02 既有主动 AI 语音录音状态，不是常驻装饰；reduced-motion 禁用，默认画板不显示。 */
.mic.listening .mic-ring{animation:micRing var(--kid-motion-loop-mid) ease-out infinite}
.mic.listening .mic-ring:nth-child(2){animation-delay:var(--kid-motion-slow)}
@keyframes micRing{0%{opacity:.55;transform:scale(1)}100%{opacity:0;transform:scale(1.75)}}
.mic-hint{position:absolute;top:-28px;left:50%;transform:translateX(-50%);white-space:nowrap;color:var(--pt-ink-soft);background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-sheet);padding:4px 10px;box-shadow:var(--pt-lift);pointer-events:none}
.voice-pill[hidden],.mic-wrap[hidden]{display:none}
.canvas-wrap.drawing-ui .mic-wrap{opacity:.12;pointer-events:none}
.voice-pill{position:absolute;top:76px;left:50%;transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:10px;height:52px;padding:0 18px;border-radius:var(--pt-shape-sheet);background:var(--pt-paper);border:1px solid var(--pt-line);box-shadow:var(--pt-lift);pointer-events:none}
/* ai-scan-allow: MO-02 既有主动语音收听指示，仅在 listening 时显示；reduced-motion 禁用，不改声音/AI 能力。 */
.vp-dot{width:14px;height:14px;border-radius:var(--pt-shape-round);background:var(--pt-ink);animation:vpPulse var(--kid-motion-loop-mid) ease-in-out infinite}
@keyframes vpPulse{0%,100%{transform:scale(.7);opacity:.5}50%{transform:scale(1);opacity:1}}
.feedback-card{position:absolute;top:76px;left:18px;z-index:9;width:min(320px,calc(100% - 36px));background:var(--pt-paper);border:1px solid var(--pt-line);border-radius:var(--pt-shape-card);box-shadow:var(--pt-lift);padding:16px;animation:fbPop var(--kid-motion-mid) ease}
@keyframes fbPop{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.fb-head{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.fb-spark{width:30px;height:30px;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);display:grid;place-items:center;flex:0 0 auto}
.fb-spark svg{width:17px;height:17px;stroke:currentColor;stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fb-tag{color:var(--pt-ink-soft);}
.fb-close{margin-left:auto;width:32px;height:32px;border-radius:var(--pt-shape-key-sm);display:grid;place-items:center;color:var(--pt-ink-soft);cursor:pointer}
.fb-close svg{width:16px;height:16px;stroke:currentColor;stroke-width:2.6;fill:none;stroke-linecap:round}
.fb-next{margin-top:6px;color:var(--pt-ink-soft)}
.fb-row{display:flex;align-items:center;gap:10px;margin-top:12px}
.fb-replay{width:44px;height:44px;flex:0 0 auto;border-radius:var(--pt-shape-key-sm);background:var(--pt-paper);color:var(--pt-ink-soft);display:grid;place-items:center;box-shadow:var(--pt-lift);cursor:pointer}
.fb-replay:active{transform:translateY(2px);box-shadow:var(--pt-lift)}
.fb-replay svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fb-replay .wave{display:none;align-items:flex-end;gap:2.5px;height:18px}
.fb-replay.speaking svg{display:none}
.fb-replay.speaking .wave{display:flex}
/* ai-scan-allow: MO-02 既有反馈朗读状态波形，仅 speaking 时显示且随朗读结束；reduced-motion 禁用。 */
.fb-replay .wave i{width:3.5px;border-radius:var(--pt-shape-key-sm);background:currentColor;animation:fbEq var(--kid-motion-loop-fast) ease-in-out infinite}
.fb-replay .wave i:nth-child(1){height:8px}
.fb-replay .wave i:nth-child(2){height:16px;animation-delay:var(--kid-motion-fast)}
.fb-replay .wave i:nth-child(3){height:11px;animation-delay:var(--kid-motion-mid)}
.fb-replay .wave i:nth-child(4){height:15px;animation-delay:var(--kid-motion-slow)}
@keyframes fbEq{0%,100%{transform:scaleY(.5)}50%{transform:scaleY(1)}}
.fb-actions{display:flex;gap:9px;flex:1}
.fb-actions button{height:48px;border-radius:var(--pt-shape-key-sm);cursor:pointer;transition:transform var(--kid-motion-fast) ease,box-shadow var(--kid-motion-fast) ease}
.fb-continue{flex:1;background:var(--pt-paper);color:var(--pt-ink-soft);box-shadow:var(--pt-lift)}
.fb-continue:active{transform:translateY(3px);box-shadow:var(--pt-lift)}
.fb-done{flex:1;background:var(--pt-ink);color:var(--pt-ink-soft);box-shadow:var(--pt-lift)}
.fb-done:active{transform:translateY(3px);box-shadow:var(--pt-lift)}
.fb-rest{display:flex;align-items:center;gap:9px;color:var(--pt-ink-soft)}
@media (prefers-reduced-motion:reduce){
.mic-ring,.vp-dot,.fb-replay .wave i{animation:none!important}
.feedback-card{animation:none}
}
[data-motion=reduced] :is(.mic-ring,.vp-dot,.fb-replay .wave i,.feedback-card){animation:none!important}
@media (max-width:900px){
.ai-look{width:50px;height:50px;padding:0;justify-content:center;border-radius:var(--pt-shape-round)}
.ai-look .ai-look-label{display:none}
.mic{width:66px;height:66px}
.mic-wrap{bottom:86px}
.voice-pill{top:70px;left:14px;transform:none;height:48px}
.feedback-card{top:auto;left:14px;right:14px;bottom:160px;width:auto}
}
@media (max-width:480px){
.mic{width:62px;height:62px}
.mic-wrap{bottom:84px}
.feedback-card{bottom:156px}
}