:root{--font-sans: "Avenir Next", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--bg-page: #edf3ff;--bg-page-alt: #f8fbff;--bg-panel: rgba(255, 255, 255, .86);--bg-panel-strong: #ffffff;--bg-subtle: #f2f6ff;--bg-input: #f7f9ff;--border: #d6e2fb;--border-strong: #c6d5f5;--text-main: #16233f;--text-sub: #4b618a;--text-muted: #7084aa;--brand: #1f6feb;--brand-strong: #1457be;--brand-soft: rgba(31, 111, 235, .12);--brand-soft-2: rgba(31, 111, 235, .18);--danger: #d93f45;--danger-strong: #b82e34;--danger-soft: rgba(217, 63, 69, .12);--danger-soft-border: rgba(217, 63, 69, .28);--markdown-strong: #174fa6;--code-bg: rgba(31, 111, 235, .12);--code-text: #184b98;--radius-sm: 10px;--radius-md: 14px;--radius-lg: 20px;--shadow-panel: 0 12px 30px rgba(19, 39, 87, .08);--shadow-soft: 0 6px 18px rgba(18, 36, 80, .08);--ring: 0 0 0 3px rgba(31, 111, 235, .2);--top-h: 72px;--gap: 16px}body.theme-dark{--bg-page: #0c1529;--bg-page-alt: #101b31;--bg-panel: rgba(18, 28, 49, .88);--bg-panel-strong: #15233d;--bg-subtle: #1a2b4a;--bg-input: #11203a;--border: #243c67;--border-strong: #2f4e84;--text-main: #e6edff;--text-sub: #a9bbde;--text-muted: #8096bf;--brand: #5da3ff;--brand-strong: #79b5ff;--brand-soft: rgba(93, 163, 255, .2);--brand-soft-2: rgba(93, 163, 255, .3);--danger: #ff7678;--danger-strong: #ff9a9a;--danger-soft: rgba(255, 118, 120, .16);--danger-soft-border: rgba(255, 118, 120, .32);--markdown-strong: #9dc3ff;--code-bg: rgba(93, 163, 255, .2);--code-text: #bed8ff;--shadow-panel: 0 12px 28px rgba(0, 0, 0, .35);--shadow-soft: 0 5px 16px rgba(0, 0, 0, .22);--ring: 0 0 0 3px rgba(93, 163, 255, .24)}*{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;overflow:hidden}body{font-family:var(--font-sans);color:var(--text-main);background:radial-gradient(1000px 520px at -8% -12%,rgba(42,137,255,.18),transparent 60%),radial-gradient(780px 440px at 105% 0%,rgba(23,176,165,.16),transparent 62%),linear-gradient(150deg,var(--bg-page),var(--bg-page-alt));line-height:1.55;-webkit-font-smoothing:antialiased;transition:background-color .2s ease,color .2s ease}.app-shell{height:100%;display:flex;flex-direction:column;overflow:hidden;position:relative}.top-banner{flex:0 0 auto;border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg-panel-strong) 86%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:3}.top-banner{height:var(--top-h);display:grid;grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);grid-template-areas:"brand tabs actions";align-items:center;gap:12px;padding:12px 22px}.brand-wrap{grid-area:brand;min-width:0}.app-title{display:flex;align-items:center;gap:8px;font-size:1.54rem;line-height:1.1;letter-spacing:.2px}.title-icon{font-size:1.2rem}.title-cn{color:var(--brand)}.app-subtitle{margin-top:5px;font-size:.86rem;color:var(--text-muted)}.banner-tabs{grid-area:tabs;justify-self:center;display:inline-flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--bg-panel-strong) 78%,transparent);border:1px solid var(--border);border-radius:999px;padding:4px;box-shadow:var(--shadow-soft)}.banner-tab{border:none;border-radius:999px;min-height:36px;padding:0 16px;background:transparent;color:var(--text-sub);display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:.87rem;font-weight:700;cursor:pointer;transition:.2s ease}.banner-tab:hover{background:var(--bg-subtle)}.banner-tab.active{background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#fff}.banner-actions{grid-area:actions;justify-self:end;display:flex;align-items:center;justify-content:flex-end;gap:8px}.font-size-controls{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:999px;padding:3px 6px;background:var(--bg-subtle)}.font-size-btn{border:1px solid transparent;border-radius:999px;min-width:34px;min-height:30px;background:transparent;color:var(--text-main);font-size:.74rem;font-weight:700;cursor:pointer;transition:.18s ease}.font-size-btn:hover:not(:disabled){border-color:color-mix(in srgb,var(--brand) 45%,var(--border));background:color-mix(in srgb,var(--brand) 9%,transparent)}.font-size-btn:disabled{opacity:.45;cursor:not-allowed}.font-size-indicator{min-width:44px;text-align:center;font-size:.72rem;font-weight:700;color:var(--text-sub)}.theme-icon-switch{width:40px;height:40px;border-radius:999px;border:1px solid var(--border);background:var(--bg-subtle);color:var(--text-main);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;font-size:1rem;transition:.2s ease}.theme-icon-switch:hover{border-color:color-mix(in srgb,var(--brand) 60%,var(--border));box-shadow:var(--ring);transform:translateY(-1px)}.workspace-frame{flex:1;min-height:0;display:grid;grid-template-columns:286px minmax(0,1fr) 320px;gap:var(--gap);padding:16px 20px;overflow:hidden;contain:paint}.left-rail,.right-rail{min-height:0;display:flex;flex-direction:column;gap:12px}.right-rail{overflow:hidden}.rail-card{border:1px solid var(--border);background:var(--bg-panel);box-shadow:var(--shadow-soft);border-radius:var(--radius-lg);padding:14px;animation:panel-in .4s ease both}.rail-title{font-size:.86rem;font-weight:700;color:var(--text-sub);margin-bottom:10px;letter-spacing:.3px}.options-rail-card{height:100%;min-height:0;display:flex;flex-direction:column}.left-options-list{display:flex;flex-direction:column;gap:2px;min-height:0;overflow-y:auto;padding-right:2px}.left-options-list::-webkit-scrollbar{width:8px}.left-options-list::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--brand) 30%,transparent);border-radius:999px}.option-line{min-height:32px;display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:var(--radius-sm);border:1px solid transparent;background:transparent;cursor:pointer;transition:.18s ease}.option-line:hover{border-color:color-mix(in srgb,var(--brand) 20%,var(--border));background:color-mix(in srgb,var(--brand) 8%,transparent)}.option-checkbox{width:14px;height:14px;accent-color:var(--brand);cursor:pointer}.option-line-text{font-size:.86rem;color:var(--text-main);line-height:1.3}.option-line:has(.option-checkbox:checked){border-color:color-mix(in srgb,var(--brand) 36%,var(--border));background:color-mix(in srgb,var(--brand) 12%,transparent)}.quiz-options-panel{display:flex;flex-direction:column;gap:10px;min-height:0}.quiz-options-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.mini-tool-btn{border:1px solid var(--border);background:var(--bg-subtle);color:var(--text-sub);border-radius:9px;min-height:30px;padding:0 8px;font-size:.78rem;font-weight:700;cursor:pointer;transition:.18s ease}.mini-tool-btn:hover{border-color:color-mix(in srgb,var(--brand) 45%,var(--border));color:var(--text-main)}.mini-tool-btn.danger{color:var(--danger-strong)}.quiz-options-meta{font-size:.77rem;color:var(--text-muted)}.quiz-options-meta strong{color:var(--brand-strong)}.quiz-group-list{gap:10px}.quiz-option-group{border:1px solid var(--border);border-radius:12px;background:color-mix(in srgb,var(--bg-subtle) 68%,transparent);padding:8px}.quiz-option-group-head{margin-bottom:6px}.quiz-option-group-title{font-size:.8rem;font-weight:700;color:var(--text-main)}.quiz-option-group-desc{font-size:.72rem;color:var(--text-muted);margin-top:2px;line-height:1.35}.quiz-option-items{display:flex;flex-direction:column;gap:4px}.quiz-option-item{min-height:32px;display:flex;align-items:flex-start;gap:8px;padding:6px 7px;border-radius:10px;border:1px solid transparent;cursor:pointer;transition:.18s ease}.quiz-option-item:hover{border-color:color-mix(in srgb,var(--brand) 25%,var(--border));background:color-mix(in srgb,var(--brand) 8%,transparent)}.quiz-option-item.checked{border-color:color-mix(in srgb,var(--brand) 38%,var(--border));background:color-mix(in srgb,var(--brand) 12%,transparent)}.quiz-option-text-wrap{display:flex;flex-direction:column;gap:1px}.quiz-option-desc{font-size:.72rem;line-height:1.35;color:var(--text-muted)}.quiz-options-footnote{font-size:.74rem;line-height:1.45;color:var(--text-muted)}.overview-pane{--output-font-scale: 1;--output-content-width: 100%;min-width:0;min-height:0;position:relative;border:1px solid var(--border-strong);background:var(--bg-panel-strong);box-shadow:var(--shadow-panel);border-radius:calc(var(--radius-lg) + 2px);display:flex;flex-direction:column;overflow:hidden;animation:panel-in .42s ease both}.overview-scroll{flex:1;min-height:0;overflow:hidden;padding:50px 18px 18px;display:flex;flex-direction:column}.copy-content-btn{position:absolute;top:12px;right:12px;z-index:2;width:34px;height:34px;border-radius:999px;border:1px solid var(--border);background:color-mix(in srgb,var(--bg-panel-strong) 86%,transparent);color:var(--text-sub);display:inline-flex;align-items:center;justify-content:center;font-size:.95rem;cursor:pointer;transition:.2s ease}.copy-content-btn:hover:not(:disabled){border-color:color-mix(in srgb,var(--brand) 55%,var(--border));box-shadow:var(--ring)}.copy-content-btn:disabled{opacity:.42;cursor:not-allowed}.copy-content-btn.done{color:#1f9d56}.copy-content-btn.error{color:var(--danger-strong)}.app-main{flex:1;min-height:0;position:relative;width:100%}.tab-panel{width:100%;height:100%;min-height:0}.tab-panel.hidden{display:none}.tab-panel.active{display:block}.tab-content{width:var(--output-content-width);max-width:none;margin:0 auto;height:100%;min-height:0;display:flex;flex-direction:column;gap:12px}.tab-chat-layout{overflow:hidden}.tab-body-scroll{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:12px;padding-right:2px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable}.tab-body-scroll::-webkit-scrollbar{width:10px}.tab-body-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--brand) 35%,transparent);border-radius:999px}.tab-body-scroll::-webkit-scrollbar-track{background:transparent}.composer-panel,.error-banner,.stream-output{animation:content-in .35s ease both}.composer-panel{flex:0 0 24%;min-height:170px;max-height:34vh;border:1px solid var(--border);background:var(--bg-panel);border-radius:var(--radius-lg);padding:14px;display:flex;flex-direction:column}.input-label{display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:700;color:var(--text-sub);margin-bottom:10px}.label-icon{font-size:1rem}.input-row{display:flex;gap:8px}.word-input,.quiz-textarea,.chat-input-box,.model-select,.difficulty-select{width:100%;border-radius:var(--radius-md);border:1px solid var(--border);background:var(--bg-input);color:var(--text-main);font-family:inherit;font-size:.92rem;transition:.2s ease}.word-input{padding:12px 14px}.quiz-textarea{resize:vertical;min-height:138px;line-height:1.55;padding:12px 14px}.chat-input-box{flex:1;min-height:120px;resize:none;line-height:1.55;padding:12px 14px}.word-input:focus,.quiz-textarea:focus,.chat-input-box:focus,.model-select:focus,.difficulty-select:focus{border-color:color-mix(in srgb,var(--brand) 60%,var(--border));box-shadow:var(--ring);outline:none}.word-input::placeholder,.quiz-textarea::placeholder,.chat-input-box::placeholder{color:var(--text-muted)}.quiz-textarea:disabled,.word-input:disabled,.chat-input-box:disabled{opacity:.6}.textarea-hint{margin-top:8px;text-align:right;font-size:.74rem;color:var(--text-muted)}.stream-output{padding:2px 2px 12px}.inline-loading{margin-bottom:8px}.options-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:9px}.action-section{display:flex}.mobile-action-row{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:none;border-radius:var(--radius-md);padding:10px 24px;font-size:.92rem;font-weight:700;cursor:pointer;transition:.2s ease}.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#fff;box-shadow:0 10px 18px color-mix(in srgb,var(--brand) 30%,transparent)}.btn-primary:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.03)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-stop{background:linear-gradient(135deg,var(--danger),var(--danger-strong));color:#fff}.error-banner{border:1px solid var(--danger-soft-border);background:var(--danger-soft);color:var(--danger-strong);border-radius:var(--radius-md);padding:10px 12px;font-size:.88rem;display:flex;align-items:center;gap:7px}.result-section{border:1px solid var(--border);background:var(--bg-panel);border-radius:var(--radius-lg);box-shadow:var(--shadow-soft);overflow:hidden}.result-header{border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg-subtle) 85%,transparent);padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:8px}.result-header h3{display:flex;align-items:center;gap:6px;font-size:.93rem}.loading-indicator{display:inline-flex;align-items:center;gap:7px;color:var(--brand-strong);font-size:.8rem;font-weight:600}.loading-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);animation:pulse 1.15s ease-in-out infinite}.result-body{padding:16px;overflow-x:auto}.markdown-body{color:var(--text-main);font-size:calc(.93rem * var(--output-font-scale));line-height:1.72}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4{margin-top:1.15em;margin-bottom:.58em;line-height:1.34}.markdown-body h1{font-size:1.5rem}.markdown-body h2{font-size:1.26rem;border-bottom:1px solid var(--border);padding-bottom:.25em}.markdown-body h3{font-size:1.08rem}.markdown-body p,.markdown-body ul,.markdown-body ol{margin-bottom:.78em}.markdown-body ul,.markdown-body ol{padding-left:1.45em}.markdown-body ul{list-style:decimal}.markdown-body li{margin-bottom:.3em}.markdown-body strong{color:var(--markdown-strong)}.markdown-body blockquote{margin:.9em 0;border-left:3px solid var(--brand);background:var(--brand-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0;padding:10px 14px;color:var(--text-sub)}.markdown-body code{background:var(--code-bg);color:var(--code-text);border-radius:6px;padding:2px 6px;font-size:.87em;font-family:SF Mono,Menlo,Consolas,monospace}.markdown-body pre{border:1px solid var(--border);border-radius:var(--radius-md);background:var(--bg-input);padding:12px 14px;overflow-x:auto}.markdown-body pre code{background:transparent;padding:0}.markdown-body table{width:100%;border-collapse:collapse;margin:.8em 0;font-size:.88rem}.markdown-body table th,.markdown-body table td{border:1px solid var(--border);padding:8px 10px;text-align:left}.markdown-body table th{background:color-mix(in srgb,var(--bg-subtle) 75%,transparent)}.settings-card{display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-height:0;overflow-y:auto}.right-action-dock{margin-top:0;position:relative;flex:0 0 auto}.right-action-btn{width:100%;min-height:46px}.setting-item{display:flex;flex-direction:column;gap:7px}.setting-label{font-size:.8rem;color:var(--text-sub);font-weight:700}.theme-toggle{border:1px solid var(--border);background:var(--bg-subtle);color:var(--text-main);border-radius:var(--radius-md);min-height:40px;padding:8px 12px;font-size:.86rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;cursor:pointer;transition:.2s ease}.theme-toggle:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--border));box-shadow:var(--ring)}.model-select,.difficulty-select{min-height:40px;padding:0 10px}.model-select option,.difficulty-select option{background:var(--bg-panel-strong);color:var(--text-main)}.helper-card ul{list-style:none;display:flex;flex-direction:column;gap:8px}.helper-card li{font-size:.82rem;color:var(--text-sub);border:1px dashed var(--border);background:var(--bg-subtle);border-radius:var(--radius-sm);padding:8px}@keyframes pulse{0%,to{opacity:.28;transform:scale(.82)}50%{opacity:1;transform:scale(1.15)}}@keyframes panel-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes content-in{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1360px){.workspace-frame{grid-template-columns:256px minmax(0,1fr) 286px;padding:14px}}@media(max-width:1100px){.workspace-frame{grid-template-columns:240px minmax(0,1fr)}.right-rail{display:none}.mobile-action-row{display:flex}.mobile-action-row .btn{width:100%}}@media(max-width:860px){.top-banner{padding:10px 12px;height:auto;min-height:var(--top-h);grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand actions" "tabs tabs";align-items:start}.app-title{font-size:1.3rem}.banner-tabs{width:100%;justify-content:center;margin-top:2px}.banner-actions{gap:6px}.font-size-controls{padding:2px 5px}.font-size-indicator{min-width:40px}.workspace-frame{padding:10px;gap:10px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}.left-rail{flex-direction:row;overflow-x:auto;padding-bottom:2px}.left-rail .rail-card{min-width:286px;margin-right:2px}.overview-scroll{padding:46px 12px 12px}.tab-content{width:100%;max-width:100%}}@media(max-width:540px){.app-subtitle{display:none}.left-rail .rail-card{min-width:250px}.copy-content-btn{top:10px;right:10px}}
