/* 2026-09-25 确认：全端共享的蓝色操作、灰白阅读面及语义状态色。 */
:root{--tutor-ink:#283343;--tutor-muted:#6b7686;--tutor-accent:#326bd6;--tutor-accent-hover:#2459bb;--tutor-canvas:#f7f8fa;--tutor-paper:#fff;--tutor-line:#e2e7ee;--tutor-control:#a4adba;--tutor-soft:#edf3ff;--tutor-entry-secondary:#f0f2f7;--tutor-focus:#8299b8;--tutor-error:#b42318;--tutor-error-bg:#fff3f2;--tutor-success:#18734b;--tutor-warning:#8b5d16;--tutor-radius:16px;--tutor-font:-apple-system,BlinkMacSystemFont,'PingFang SC','Segoe UI','Microsoft YaHei',sans-serif;--tutor-shadow:0 6px 24px #28334308}
.wb-app{font-family:var(--tutor-font);color:var(--tutor-ink);background:var(--tutor-paper);max-width:960px;border-color:var(--tutor-line);font-size:15px}
.wb-app button{border:1px solid var(--tutor-line);background:var(--tutor-paper);color:var(--tutor-ink);border-radius:12px;min-height:44px;padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 14px/1.4 var(--tutor-font);transition:background .15s,border-color .15s}
.wb-app button:hover:not(:disabled){background:var(--tutor-soft);border-color:var(--tutor-control)}
.wb-app button:disabled{opacity:.45;cursor:not-allowed}
.wb-app button:focus-visible,.device-lab :focus-visible{outline:3px solid var(--tutor-focus);outline-offset:3px}
.wb-icon{width:22px;height:22px;display:block;flex-shrink:0;pointer-events:none}
.wb-header{min-height:70px;padding:10px 18px;border-color:var(--tutor-line);background:var(--tutor-paper)}
.wb-header button{border:0;background:transparent;padding:10px;width:44px}
.wb-header strong{font-size:16px;letter-spacing:.01em;max-width:65vw}
.wb-header small{color:var(--tutor-muted);font-size:11px;margin-top:3px;display:block}
.wb-messages{padding:20px max(20px,calc((100% - 720px)/2)) 28px;scrollbar-width:thin}
.wb-local-note{font-size:11px;color:var(--tutor-muted);line-height:1.6;margin-bottom:24px}
.wb-empty{padding:clamp(32px,9vh,100px) 4px 32px}
.wb-empty h1{font:650 clamp(24px,3vw,30px)/1.5 var(--tutor-font);letter-spacing:-.04em;margin:20px 0 12px}
.wb-empty p{color:var(--tutor-muted);font-size:14px;line-height:1.8}
.wb-app .wb-primary{background:var(--tutor-accent);color:white;border:1px solid var(--tutor-accent);padding:12px 20px;box-shadow:var(--tutor-shadow)}
.wb-app .wb-primary:hover:not(:disabled),.wb-app .wb-send:hover:not(:disabled){background:var(--tutor-accent-hover);border-color:var(--tutor-accent-hover)}
.wb-brand{background:var(--tutor-soft);color:var(--tutor-accent);border-radius:16px}
.wb-message{margin:20px 0 28px}
.wb-user{background:var(--tutor-soft);padding:14px;border-radius:18px 18px 5px 18px;max-width:86%}
.wb-user>small{display:block;font-size:11px;color:var(--tutor-muted);margin-top:10px}
.wb-images{gap:8px}.wb-images a{display:block;max-width:100%;border-radius:10px;overflow:hidden}.wb-images img{max-width:min(230px,100%);max-height:280px;display:block}
.wb-answer p{font-size:15px;line-height:1.8;margin:8px 0}.wb-answer h3{font-size:14px;color:var(--tutor-accent);font-weight:650;line-height:1.6;margin:24px 0 10px}
.wb-speaker{color:var(--tutor-muted);font-size:11px}
.wb-app .wb-teach{background:var(--tutor-paper);justify-content:space-between;color:var(--tutor-accent);border-color:var(--tutor-line);font-weight:600;padding:12px 16px}
.wb-teach-options{gap:8px}.wb-teach-options button{background:var(--tutor-soft);border:0;flex:1;font-weight:500}
.wb-task{padding:16px 18px;border:1px solid var(--tutor-line);border-radius:var(--tutor-radius);background:var(--tutor-canvas);margin:16px 0;font-size:14px;line-height:1.7}
.wb-task p{font-size:13px;color:var(--tutor-muted);margin:6px 0 12px}.wb-task small{font-size:11px;color:var(--tutor-muted)}
.wb-failure{background:var(--tutor-error-bg);border:1px solid #f0d9cb;border-radius:var(--tutor-radius);padding:16px 18px;margin:16px 0}
.wb-failure header{display:flex;align-items:center;gap:10px;color:var(--tutor-error);font-size:14px;font-weight:600}.wb-failure p{font-size:13px;color:var(--tutor-muted);line-height:1.8;margin:10px 0}.wb-failure small{display:block;font-size:10px;color:var(--tutor-muted);overflow-wrap:anywhere;margin:8px 0 12px}
.wb-failure button{background:var(--tutor-paper);border-color:#e4c8b8;color:var(--tutor-error)}
.wb-error{background:var(--tutor-error-bg);color:var(--tutor-error);border:1px solid #f0d9cb;line-height:1.7}
.wb-composer{border-color:var(--tutor-line);padding:14px max(14px,calc((100% - 760px)/2)) max(12px,env(safe-area-inset-bottom))}
.wb-input{border-radius:26px;background:var(--tutor-canvas);border:1px solid var(--tutor-line);padding:5px;align-items:center;gap:2px}
.wb-input button{border:0;background:transparent;width:42px;min-width:42px;height:44px;padding:9px;border-radius:50%}
.wb-input textarea{font:15px/24px var(--tutor-font);padding:10px 3px;color:var(--tutor-ink);height:44px}.wb-input textarea::placeholder{color:#7b8883}
.wb-input .wb-send{background:var(--tutor-accent);color:var(--tutor-paper);width:40px;min-width:40px;height:40px;min-height:40px}
.wb-composer>small{font-size:10px;color:var(--tutor-muted);margin-top:9px;line-height:1.5}
.wb-app .wb-previews button{width:24px;min-height:24px;padding:3px;background:var(--tutor-accent);color:white;border:0}.wb-previews .wb-icon{width:15px;height:15px}
.wb-plus{padding:14px 6px;gap:12px}.wb-plus button{flex:1;flex-direction:column;background:var(--tutor-canvas);border:0;min-height:78px;font-size:12px;font-weight:500;border-radius:16px}
.wb-drawer{background:var(--tutor-paper);padding:20px 16px;box-shadow:var(--tutor-shadow)}.wb-drawer nav button{display:flex;align-items:start;flex-direction:column;gap:6px;border:0;padding:14px 12px;margin:3px 0;min-height:60px;font-weight:500}.wb-drawer nav small{font-size:11px;color:var(--tutor-muted);font-weight:400}.wb-drawer nav strong{font-weight:550;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wb-drawer header button,.wb-sheet header button{background:transparent;border:0;padding:8px}.wb-drawer input{border-color:var(--tutor-line);font:14px var(--tutor-font);background:var(--tutor-canvas)}
.wb-app .wb-choice{display:flex;justify-content:space-between;width:100%;padding:18px;border-radius:14px;margin:12px 0;font-size:15px}.wb-sheet{padding:22px 22px 32px}.wb-sheet h2{font:600 18px var(--tutor-font)}
.wb-app .wb-crop button{color:inherit;background:transparent;border:0}.wb-app .wb-crop .wb-primary{background:var(--tutor-accent);color:white}.wb-crop{left:0;right:0}.wb-crop .wb-handle{padding:0;border-radius:0}
.wb-preview-link{font-size:11px;color:var(--tutor-accent);display:inline-flex;align-items:center;gap:4px;text-decoration:none;margin-top:3px}.wb-preview-link .wb-icon{width:13px;height:13px}
.device-lab{font-family:var(--tutor-font);min-height:100dvh;background:var(--tutor-canvas);color:var(--tutor-ink);padding:0 0 40px}.device-toolbar{padding:18px 24px;background:#fff;border-bottom:1px solid var(--tutor-line);display:flex;align-items:center;gap:14px;flex-wrap:wrap;position:sticky;top:0;z-index:5}.device-toolbar div{margin-right:auto}.device-toolbar small{display:block;color:var(--tutor-muted);font-size:11px;margin-top:5px}.device-toolbar label{display:flex;align-items:center;gap:8px;font-size:12px}.device-toolbar select,.device-toolbar button,.device-toolbar a{font:13px var(--tutor-font);padding:10px 12px;border:1px solid var(--tutor-line);border-radius:10px;background:#fff;color:var(--tutor-ink);text-decoration:none}.device-caption{text-align:center;font-size:12px;color:var(--tutor-muted);margin:20px}.device-stage{overflow:auto;padding:10px 20px 30px;display:flex;justify-content:safe center}.device-size{flex:none;position:relative;box-shadow:0 24px 80px #183f3220;outline:6px solid var(--tutor-control);border-radius:20px}.device-size iframe{display:block;border:0;border-radius:20px;background:white;transform-origin:top left}
@media(max-width:600px){.wb-preview-link{display:none}.wb-header{padding:8px 12px;min-height:66px}.wb-messages{padding:16px 16px 24px}.wb-composer{padding-left:10px;padding-right:10px}.wb-user{max-width:90%}.wb-teach-options button{font-size:13px;padding:11px 8px}}
@media(prefers-reduced-motion:reduce){.wb-app *{scroll-behavior:auto!important;transition:none!important}}
/* Quiet Study：账号、额度、管理页共用语义变量，无独立配色。 */
.trial-auth{margin:0;background:var(--tutor-canvas);color:var(--tutor-ink);font:15px/1.7 var(--tutor-font)}
.trial-login{box-sizing:border-box;max-width:440px;margin:clamp(32px,10vh,110px) auto;padding:32px}
.trial-brand{font-size:12px;letter-spacing:.12em;color:var(--tutor-accent);font-weight:650}
.trial-login h1{font:650 30px/1.35 var(--tutor-font);letter-spacing:-.035em;margin:22px 0 14px}
.trial-login>p{color:var(--tutor-muted);font-size:14px;margin-bottom:28px}
.trial-login form,.trial-form{display:grid;gap:16px}.trial-login label,.trial-form label{display:grid;gap:7px;font-size:13px;font-weight:550}
.trial-login input,.trial-form input,.trial-form select,.trial-form textarea{box-sizing:border-box;min-width:0;width:100%;min-height:46px;border:1px solid var(--tutor-line);border-radius:12px;padding:11px 13px;background:var(--tutor-paper);color:var(--tutor-ink);font:16px/1.5 var(--tutor-font)}
.trial-login button,.trial-page button,.trial-wallet button,.trial-page a,.trial-wallet a{box-sizing:border-box;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--tutor-line);border-radius:12px;padding:10px 14px;font:550 14px/1.5 var(--tutor-font);background:var(--tutor-paper);color:var(--tutor-ink);text-decoration:none;cursor:pointer}
.trial-login .trial-primary,.trial-page .trial-primary{background:var(--tutor-accent);color:var(--tutor-paper);border-color:var(--tutor-accent)}
.trial-login input:focus-visible,.trial-page :focus-visible,.trial-wallet :focus-visible{outline:2px solid var(--tutor-focus);outline-offset:3px}
.trial-login button:disabled,.trial-page button:disabled{opacity:.55;cursor:wait}
.trial-login #error{color:var(--tutor-error);font-size:13px;margin:0}.trial-help{text-align:center;font-size:13px!important}.trial-footnote{text-align:center;font-size:11px!important;margin-top:42px!important}
.trial-page{box-sizing:border-box;font:15px/1.7 var(--tutor-font);color:var(--tutor-ink);background:var(--tutor-canvas);min-height:100dvh;padding-bottom:36px}
.trial-header{background:var(--tutor-paper);border-bottom:1px solid var(--tutor-line);padding:18px max(20px,calc((100% - 1040px)/2));display:flex;align-items:center;justify-content:space-between;gap:16px}
.trial-header h1{font-size:18px;margin:0}.trial-header p{font-size:12px;margin:3px 0;color:var(--tutor-muted)}
.trial-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.trial-body{max-width:1040px;margin:auto;padding:24px 20px;display:grid;gap:20px}
.trial-columns{display:grid;grid-template-columns:1fr 1fr;gap:20px}.trial-card,.trial-wallet{background:var(--tutor-paper);border:1px solid var(--tutor-line);border-radius:var(--tutor-radius);padding:22px}
.trial-card h2,.trial-wallet h2{font:600 17px/1.5 var(--tutor-font);margin:0 0 14px}.trial-card p,.trial-wallet p{font-size:13px;color:var(--tutor-muted);margin:8px 0 14px}.trial-kicker{font-size:11px;color:var(--tutor-accent);text-transform:uppercase;letter-spacing:.08em}
.trial-family-top{display:flex;align-items:start;justify-content:space-between;gap:14px;flex-wrap:wrap}.trial-family-top strong{font-size:24px;font-weight:600}.trial-family-top small{display:block;color:var(--tutor-muted);font-size:11px}
.trial-metrics{display:flex;gap:18px;flex-wrap:wrap;color:var(--tutor-muted);font-size:12px;margin:12px 0 18px}
.trial-account{padding:12px 0;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border-top:1px solid var(--tutor-line)}.trial-account b{font-size:14px;font-weight:550}.trial-account small{display:block;font-size:11px;color:var(--tutor-muted)}
.trial-card details{border-top:1px solid var(--tutor-line);padding-top:12px;margin-top:14px}.trial-card summary,.trial-wallet summary{cursor:pointer;font-size:13px;min-height:36px;align-content:center;color:var(--tutor-accent)}
.trial-notice{padding:14px 16px;border-radius:12px;background:var(--tutor-soft);font-size:13px}.trial-notice[role=alert]{color:var(--tutor-error);background:var(--tutor-error-bg)}
.trial-credentials{border:1px solid var(--tutor-accent);background:var(--tutor-soft)}.trial-credentials code{display:block;overflow-wrap:anywhere;user-select:all;font:14px/1.8 ui-monospace,monospace;margin:8px 0}
.trial-ledger{list-style:none;margin:12px 0;padding:0}.trial-ledger li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-top:1px solid var(--tutor-line);font-size:12px}.trial-ledger small{display:block;color:var(--tutor-muted)}.trial-ledger b{white-space:nowrap;font-weight:550}
.trial-wallet{margin:12px 0 24px}.trial-wallet strong{font-size:22px}.trial-wallet>a{margin-top:10px}.trial-child-credit{margin:12px 0;font-size:13px;background:var(--tutor-soft);padding:12px 16px;border-radius:12px;color:var(--tutor-ink)}
@media(max-width:650px){.trial-columns{grid-template-columns:1fr}.trial-header{align-items:start;padding:14px 16px;flex-wrap:wrap}.trial-body{padding:16px 12px}.trial-card,.trial-wallet{padding:18px}.trial-account .trial-actions{width:100%}.trial-login{padding:28px 24px;margin:7vh auto}}

/* 家庭目录：表格为主，创建与管理操作收进统一弹窗。 */
.trial-directory{border:1px solid var(--tutor-line);border-radius:var(--tutor-radius);background:var(--tutor-paper);overflow:hidden}
.trial-toolbar{padding:20px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.trial-search{flex:1;min-width:230px}.trial-search input{box-sizing:border-box;width:100%;min-height:46px;padding:11px 14px;border:1px solid var(--tutor-line);border-radius:12px;background:var(--tutor-canvas);font:15px var(--tutor-font);color:var(--tutor-ink)}
.trial-directory-caption{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 20px 16px;color:var(--tutor-muted);font-size:12px}
.trial-table-scroll{overflow-x:auto}.trial-table{border-collapse:collapse;width:100%;text-align:left;font-size:13px}.trial-table th{background:var(--tutor-canvas);color:var(--tutor-muted);font-size:12px;font-weight:550;white-space:nowrap}.trial-table th,.trial-table td{padding:14px 18px;border-bottom:1px solid var(--tutor-line);vertical-align:middle}.trial-table td:first-child{min-width:90px;max-width:210px;overflow-wrap:anywhere}.trial-table tr:last-child td{border-bottom:0}.trial-table tbody tr:hover{background:var(--tutor-soft)}.trial-table .trial-actions{flex-wrap:nowrap}.trial-table button{white-space:nowrap}
.trial-account-label{padding:4px 0;white-space:nowrap}.trial-account-number{font-variant-numeric:tabular-nums;letter-spacing:.02em}.trial-table small{display:block;color:var(--tutor-muted);font-size:11px}.trial-table .trial-status-off{color:var(--tutor-error)}.trial-amount{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}.trial-table .trial-empty{padding:44px 24px;text-align:center;color:var(--tutor-muted)}
.trial-pagination{padding:12px 20px;border-top:1px solid var(--tutor-line);display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--tutor-muted)}
.trial-modal{box-sizing:border-box;width:min(680px,calc(100% - 32px));max-height:calc(100dvh - 48px);padding:24px;border:1px solid var(--tutor-line);border-radius:var(--tutor-radius);background:var(--tutor-paper);color:var(--tutor-ink);font:14px/1.7 var(--tutor-font);box-shadow:0 24px 80px #20393625}.trial-modal::backdrop{background:#20393666}.trial-modal>header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.trial-modal h2{font-size:18px;margin:0;overflow-wrap:anywhere}.trial-modal>p,.trial-modal small{color:var(--tutor-muted)}.trial-modal>header button{flex-shrink:0}.trial-page svg{width:22px;height:22px}.trial-modal details{margin:18px 0;border-top:1px solid var(--tutor-line);padding-top:12px}.trial-modal summary{cursor:pointer;min-height:44px;align-content:center;color:var(--tutor-accent)}.trial-add-child{display:flex;align-items:center;gap:12px;margin:16px 0;flex-wrap:wrap}.trial-family-remark{grid-template-columns:1fr auto;align-items:end;border-block:1px solid var(--tutor-line);padding:18px 0;margin:18px 0}.trial-modal .trial-table th,.trial-modal .trial-table td{padding:12px 10px}
.trial-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:650px){.trial-toolbar{padding:16px;gap:12px}.trial-search{min-width:100%}.trial-table th,.trial-table td{padding:12px}.trial-directory-caption{padding:0 16px 12px}.trial-modal{padding:18px;max-height:calc(100dvh - 24px)}.trial-family-remark{grid-template-columns:1fr}.trial-toolbar>.trial-actions{width:100%}}

/* V0.2 登录与改密：与孩子、家长端共用浅灰画布与中性色文字。 */
.trial-auth{min-height:100dvh}
.trial-auth .trial-login{width:100%;max-width:400px;margin:0 auto;padding:clamp(48px,12vh,120px) 24px 40px}
.auth-heading{text-align:center;margin-bottom:36px}.auth-logo{display:block;margin:0 auto 18px;border-radius:0}.auth-heading h1{font-size:24px;font-weight:600;line-height:1.4;letter-spacing:0;margin:0 0 8px}.auth-heading p{font-size:14px;color:var(--tutor-muted);margin:0}
.trial-auth .trial-login form{gap:20px}.trial-auth .trial-login label{font-size:14px;font-weight:400;gap:8px}.trial-auth .trial-login input{height:52px;border-radius:14px;padding:13px 16px;background:#fff}.trial-auth .trial-login input::placeholder{color:#999da1}.trial-auth .trial-login input:focus-visible{border-color:var(--tutor-control);outline:2px solid #e1e4e6;outline-offset:2px}.trial-auth .trial-login button:focus-visible{outline:2px solid var(--tutor-focus);outline-offset:3px}
.trial-auth .trial-login .trial-primary{height:48px;background:var(--tutor-accent);border-color:var(--tutor-accent);border-radius:14px;font-size:16px;font-weight:500;margin-top:4px}.trial-auth .trial-login .trial-primary:hover:not(:disabled){background:var(--tutor-accent-hover)}.trial-auth .trial-login #error:empty{display:none}.trial-auth .trial-login #error{line-height:1.6}.trial-auth .trial-login .trial-help{font-size:12px!important;color:var(--tutor-muted);margin:22px 0 0}.studio-brand img{border-radius:9px;flex-shrink:0}
@media(max-height:600px){.trial-auth .trial-login{padding-top:28px}.auth-heading{margin-bottom:24px}}
