876a3b8768
新增两个独立思想实验室: 1. 万花筒模拟器:支持可调参数物理万花筒效果,配置方案SQLite持久化 2. 闵可夫斯基画板:支持世界线绘制、洛伦兹变换、光锥因果判定 同时添加自动绑定实验室后端的逻辑,以及配套的单元测试与前端页面
2967 lines
163 KiB
HTML
2967 lines
163 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN" data-theme="light" data-trae-theme="dark"><head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
|
||
<title>老式物理万花筒</title>
|
||
<style>
|
||
:root{
|
||
--bg:#0c0a08; --panel:#1a1612; --accent:#c9a227;
|
||
--txt:#d8c9a8; --muted:#8a7a5c;
|
||
}
|
||
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
|
||
html,body{margin:0;padding:0;height:100%}
|
||
body{
|
||
background:radial-gradient(1200px 800px at 50% -10%,#1a140d 0%,#0c0a08 60%,#050403 100%);
|
||
color:var(--txt);
|
||
font-family:"Segoe UI",Tahoma,"Microsoft YaHei",sans-serif;
|
||
min-height:100%;
|
||
display:flex;flex-direction:column;align-items:center;
|
||
padding:14px 10px 22px;user-select:none;overflow-x:hidden;
|
||
}
|
||
/* 控制面板:横向可换行 */
|
||
#panel{
|
||
width:min(980px,96vw);
|
||
background:linear-gradient(180deg,#221a12,#15100a);
|
||
border:1px solid #3a2c1a;border-radius:12px;
|
||
box-shadow:0 6px 20px rgba(0,0,0,.6),inset 0 1px 0 rgba(255,220,150,.06);
|
||
padding:12px 14px;display:flex;flex-wrap:wrap;gap:10px 18px;align-items:flex-end;
|
||
}
|
||
.ctrl{display:flex;flex-direction:column;gap:4px;min-width:118px}
|
||
.ctrl label{font-size:11px;color:var(--muted);letter-spacing:.5px}
|
||
.ctrl .row{display:flex;align-items:center;gap:6px}
|
||
.ctrl input[type=range]{width:108px;accent-color:var(--accent)}
|
||
.ctrl .val{font-size:12px;color:var(--accent);min-width:44px;text-align:right;font-variant-numeric:tabular-nums}
|
||
.check{flex-direction:row;align-items:center;gap:6px;min-width:auto;padding-bottom:2px}
|
||
.check input{accent-color:var(--accent);width:16px;height:16px}
|
||
.check label{font-size:13px;color:var(--txt);cursor:pointer}
|
||
.btn{
|
||
background:linear-gradient(180deg,#3a2a16,#241a0e);
|
||
color:var(--txt);border:1px solid #5a4326;border-radius:8px;
|
||
padding:9px 14px;font-size:13px;cursor:pointer;letter-spacing:.5px;
|
||
box-shadow:0 2px 0 rgba(0,0,0,.4),inset 0 1px 0 rgba(255,220,150,.08);
|
||
transition:transform .05s,filter .15s;
|
||
}
|
||
.btn:hover{filter:brightness(1.15)}
|
||
.btn:active{transform:translateY(1px)}
|
||
.btn.primary{border-color:var(--accent);color:#f6e6b8}
|
||
/* 舞台与木壳 */
|
||
#stage{margin-top:18px;display:flex;align-items:center;justify-content:center}
|
||
#shell{
|
||
position:relative;border-radius:50%;padding:16px;
|
||
background:radial-gradient(circle at 50% 38%,#6b4a26 0%,#4a3018 42%,#2a1c0e 76%,#120c06 100%);
|
||
box-shadow:
|
||
0 0 0 4px #0a0604,
|
||
0 26px 60px rgba(0,0,0,.85),
|
||
0 0 90px rgba(0,0,0,.55),
|
||
inset 0 0 30px rgba(0,0,0,.7),
|
||
inset 0 2px 4px rgba(255,200,120,.15);
|
||
}
|
||
#cv{display:block;border-radius:50%;background:#000;cursor:grab;touch-action:none;
|
||
box-shadow:inset 0 0 34px rgba(0,0,0,.9),0 0 0 2px #1a1208}
|
||
#cv:active{cursor:grabbing}
|
||
#tip{margin-top:16px;font-size:12px;color:var(--muted);letter-spacing:.6px;text-align:center}
|
||
.toast{
|
||
position:fixed;left:50%;top:18px;transform:translateX(-50%);
|
||
background:#2a1d12;color:#f6e6b8;border:1px solid var(--accent);
|
||
padding:8px 16px;border-radius:8px;font-size:13px;
|
||
opacity:0;transition:opacity .25s;pointer-events:none;z-index:50;
|
||
}
|
||
.toast.show{opacity:1}
|
||
@media (max-width:640px){
|
||
.ctrl{min-width:46%}.ctrl input[type=range]{width:84px}
|
||
}
|
||
</style>
|
||
<style>.trae-browser-inspect-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999997;pointer-events:auto;background:rgba(0,0,0,0)}.trae-browser-inspect-highlight-box{position:absolute;top:0;left:0;z-index:999998;display:none}.trae-browser-inspect-highlight-tag{position:absolute;left:0px;top:0px;height:18px;padding:0 6px;box-sizing:border-box;border-radius:4px;background-color:var(--vscode-icube-colorSuccessHover, "#2FB287");color:var(--vscode-icube-colorSnow, "#fff");font-size:12px;font-weight:400;display:none;align-items:center;z-index:999999}.trae-browser-inspect-highlight-box-show{display:flex}.trae-browser-inspect-select-button.trae-browser-inspect-highlight-box-show{display:flex !important}.trae-browser-inspect-select-button{position:absolute;top:0;left:0;background-color:var(--vscode-icube--bg-bg-base-secondary, "#222427");color:var(--vscode-icube--text-text-default-active, "#F5F9FE");font-size:11px;font-weight:500;border:1px solid var(--vscode-icube--border-neutral-l1, "#E0E2F217");border-radius:6px;padding:0 8px;height:32px;display:none;align-items:center;cursor:pointer;z-index:999999;gap:4px}.trae-browser-inspect-select-button svg,.trae-browser-inspect-select-button span{z-index:1}.trae-browser-inspect-select-highlight-box{background:rgba(0,0,0,0) !important}.trae-browser-inspect-select-highlight-box .trae-browser-inspect-highlight-tag{background-color:var(--vscode-icube--status-success-active, "#1E8B56")}.trae-browser-inspect-comment-card-container{position:fixed;top:0;left:0;z-index:9999999;pointer-events:auto}.trae-browser-inspect-comment-card-container .trae-browser-inspect-comment-card{display:flex;padding-top:0px !important;align-items:center;z-index:9999999 !important;background-color:var(--vscode-icube--bg-bg-menu)}*[contenteditable]{outline:none}.trae-browser-inspect-click-effect{position:fixed;width:40px;height:40px;margin-left:-20px;margin-top:-20px;border-radius:50%;background-color:var(--vscode-icube-colorSuccessHover, #2FB287);pointer-events:none;animation:trae-browser-inspect-ripple 500ms ease-out forwards;z-index:999999}@keyframes trae-browser-inspect-ripple{0%{transform:scale(0.3);opacity:.8}100%{transform:scale(2);opacity:0}}.trae-browser-inspect-ref-box{position:absolute;border:2px solid var(--vscode-icube-colorSuccessHover, "#2FB287");pointer-events:none;z-index:999998;animation:trae-browser-inspect-fadeInOut 2s ease-in-out forwards}.trae-browser-inspect-ref-label{position:absolute;top:-14px;left:0;height:14px;padding:0 4px;box-sizing:border-box;border-radius:2px;background-color:var(--vscode-icube-colorSuccessHover, "#2FB287");color:var(--vscode-icube-colorSnow, "#fff");font-size:9px;font-weight:500;display:flex;align-items:center;white-space:nowrap;z-index:999999}@keyframes trae-browser-inspect-fadeInOut{0%{opacity:0}10%{opacity:1}90%{opacity:1}100%{opacity:0}}.trae-browser-inspect-input-highlight{position:absolute;border:2px solid var(--vscode-icube-colorSuccessHover, "#2FB287");border-radius:4px;pointer-events:none;z-index:999998;box-shadow:0 0 8px var(--vscode-icube-colorSuccessHover, "#2FB287");animation:trae-browser-inspect-input-pulse 600ms ease-out forwards}@keyframes trae-browser-inspect-input-pulse{0%{opacity:0;box-shadow:0 0 0 var(--vscode-icube-colorSuccessHover, "#2FB287")}30%{opacity:1;box-shadow:0 0 12px var(--vscode-icube-colorSuccessHover, "#2FB287")}100%{opacity:0;box-shadow:0 0 0 var(--vscode-icube-colorSuccessHover, "#2FB287")}}.trae-browser-inspect-virtual-cursor{position:fixed;width:20px;height:20px;pointer-events:none;z-index:9999999;opacity:0;transition:opacity .2s ease}.trae-browser-inspect-virtual-cursor.trae-browser-inspect-cursor-visible{opacity:1}.trae-browser-inspect-virtual-cursor.trae-browser-inspect-cursor-idle{animation:trae-browser-inspect-cursor-breathe 2s ease-in-out infinite}.trae-browser-inspect-virtual-cursor svg{width:20px;height:20px;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}@keyframes trae-browser-inspect-cursor-breathe{0%,100%{opacity:.7}50%{opacity:1}}.trae-browser-inspect-scroll-indicator{position:fixed;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border-radius:8px;background-color:rgba(0,0,0,.7);color:#fff;font-size:13px;font-weight:500;pointer-events:none;z-index:999999;animation:trae-browser-inspect-indicator-fade 800ms ease-out forwards;backdrop-filter:blur(4px)}.trae-browser-inspect-scroll-indicator svg{width:16px;height:16px;fill:#fff}.trae-browser-inspect-scroll-indicator.trae-scroll-up{top:12px;left:50%;transform:translateX(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-down{bottom:12px;left:50%;transform:translateX(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-left{left:12px;top:50%;transform:translateY(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-right{right:12px;top:50%;transform:translateY(-50%)}@keyframes trae-browser-inspect-indicator-fade{0%{opacity:0;transform:translateX(-50%) scale(0.9)}15%{opacity:1;transform:translateX(-50%) scale(1)}85%{opacity:1}100%{opacity:0}}.trae-browser-inspect-scroll-indicator.trae-scroll-left,.trae-browser-inspect-scroll-indicator.trae-scroll-right{animation-name:trae-browser-inspect-indicator-fade-y}@keyframes trae-browser-inspect-indicator-fade-y{0%{opacity:0;transform:translateY(-50%) scale(0.9)}15%{opacity:1;transform:translateY(-50%) scale(1)}85%{opacity:1}100%{opacity:0}}.trae-browser-inspect-key-badge{position:fixed;bottom:60px;left:50%;transform:translateX(-50%);padding:8px 20px;border-radius:8px;background-color:rgba(0,0,0,.8);color:#fff;font-size:18px;font-weight:600;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,monospace;pointer-events:none;z-index:999999;animation:trae-browser-inspect-key-pop 500ms ease-out forwards;backdrop-filter:blur(4px);border:1px solid hsla(0,0%,100%,.15);box-shadow:0 4px 12px rgba(0,0,0,.3);letter-spacing:1px}@keyframes trae-browser-inspect-key-pop{0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(0.9)}20%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-10px)}}.trae-browser-inspect-step-badge{position:fixed;top:12px;left:12px;padding:6px 12px;border-radius:6px;background-color:var(--vscode-icube-colorSuccessHover, #2FB287);color:#fff;font-size:12px;font-weight:600;pointer-events:none;z-index:999999;animation:trae-browser-inspect-step-slide 600ms ease-out forwards;box-shadow:0 2px 8px rgba(47,178,135,.3);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trae-browser-inspect-step-badge.trae-step-old{opacity:.4;transform:translateY(0)}@keyframes trae-browser-inspect-step-slide{0%{opacity:0;transform:translateX(-20px)}20%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(0)}}.trae-browser-inspect-drag-trail{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:999998}.trae-browser-inspect-drag-trail svg{width:100%;height:100%}.trae-browser-inspect-drag-trail .trae-drag-path{fill:none;stroke:var(--vscode-icube-colorSuccessHover, #2FB287);stroke-width:2;stroke-dasharray:8 4;opacity:.6;animation:trae-browser-inspect-dash 600ms linear forwards}.trae-browser-inspect-drag-trail .trae-drag-dot{fill:var(--vscode-icube-colorSuccessHover, #2FB287);filter:drop-shadow(0 0 4px rgba(47, 178, 135, 0.6))}.trae-browser-inspect-drag-trail .trae-drag-endpoint{fill:none;stroke:var(--vscode-icube-colorSuccessHover, #2FB287);stroke-width:2;opacity:.5}@keyframes trae-browser-inspect-dash{0%{stroke-dashoffset:200}100%{stroke-dashoffset:0}}.trae-browser-inspect-drag-trail.trae-drag-fade{animation:trae-browser-inspect-trail-fade 400ms ease-out forwards}@keyframes trae-browser-inspect-trail-fade{0%{opacity:1}100%{opacity:0}}</style><script type="module">(async () => {
|
||
try {
|
||
const client = await import('/@vite/client');
|
||
const hmr = client.createHotContext('hmr-handler/fake.js');
|
||
hmr.on('vite:afterUpdate', window['__ICUBE_WEBVIEW_HMR_CALLBACK_1786004552683']);
|
||
} catch {}
|
||
})();</script><style>.buttonsCard-bTXa5j {
|
||
padding: var(--spacer-4);
|
||
background: none;
|
||
align-items: center;
|
||
gap: 0;
|
||
display: inline-flex;
|
||
}
|
||
|
||
.actionButton-opZL8g {
|
||
align-items: center;
|
||
gap: var(--spacer-4);
|
||
padding: var(--spacer-4) var(--spacer-8);
|
||
border-radius: var(--radius-4);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
background: none;
|
||
border: none;
|
||
display: inline-flex;
|
||
}
|
||
|
||
.actionButton-opZL8g:hover {
|
||
background: var(--bg-bg-overlay-l2);
|
||
}
|
||
|
||
.actionButton-opZL8g:active {
|
||
background: var(--bg-bg-overlay-l3);
|
||
}
|
||
|
||
.actionButton-opZL8g:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.icon-ObJEMt {
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--icon-icon-default);
|
||
flex-shrink: 0;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.title-GptGAg {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
white-space: nowrap;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.shortcut-nbwTG4 {
|
||
color: var(--icon-icon-secondary);
|
||
flex-shrink: 0;
|
||
align-items: center;
|
||
gap: 2px;
|
||
display: flex;
|
||
}
|
||
|
||
.shortcutKey-EE6xrE {
|
||
font-family: var(--font-family-default);
|
||
color: var(--icon-icon-secondary);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 12px;
|
||
}
|
||
|
||
.divider-cFGVKQ {
|
||
box-sizing: content-box;
|
||
background-clip: content-box;
|
||
background-color: var(--border-border-neutral-l2);
|
||
flex-shrink: 0;
|
||
width: 1px;
|
||
height: 12px;
|
||
padding: 0 6px;
|
||
}
|
||
|
||
</style><style>.commentEditorCard-Un4Xaa {
|
||
width: 320px;
|
||
padding: var(--spacing-sm);
|
||
background: none;
|
||
flex-direction: column;
|
||
display: flex;
|
||
}
|
||
|
||
.textContainer-ZISwbW {
|
||
padding: var(--spacing-sm);
|
||
background: var(--bg-bg-overlay-l1);
|
||
border: 1px solid var(--border-border-neutral-l3);
|
||
border-radius: var(--radius-sm);
|
||
align-items: center;
|
||
gap: var(--spacing-sm);
|
||
padding-right: 0;
|
||
display: flex;
|
||
}
|
||
|
||
.textarea-ggj4j6 {
|
||
padding: 0 var(--spacing-sm) 0 2px;
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
resize: none;
|
||
scrollbar-width: thin;
|
||
scrollbar-color: #56637726 transparent;
|
||
background: none;
|
||
border: none;
|
||
outline: none;
|
||
flex: 1;
|
||
max-height: 140px;
|
||
font-size: 13px;
|
||
font-weight: 400;
|
||
line-height: 20px;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar {
|
||
width: 6px;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar-track {
|
||
background: none;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar-thumb {
|
||
background: #56637726;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.textarea-ggj4j6::placeholder {
|
||
color: var(--text-text-tertiary);
|
||
}
|
||
|
||
.actionBar-u_t8vc {
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
gap: var(--spacing-xs);
|
||
opacity: 0;
|
||
max-height: 0;
|
||
transition: max-height .2s ease-out, opacity .2s ease-out, margin-top .2s ease-out;
|
||
display: flex;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.actionBarVisible-PxXsje {
|
||
opacity: 1;
|
||
max-height: 32px;
|
||
margin-top: var(--spacing-sm);
|
||
}
|
||
|
||
.actionBarNoExpandAnimation-FCra2J {
|
||
transition: opacity .2s ease-out;
|
||
}
|
||
|
||
.actionBarNoExpandAnimation-FCra2J.actionBarVisible-PxXsje {
|
||
max-height: 32px;
|
||
margin-top: var(--spacing-sm);
|
||
}
|
||
|
||
.cancelButton-Lu0me9 {
|
||
height: 24px;
|
||
padding: 0 var(--spacing-xs);
|
||
background: var(--bg-bg-overlay-l2);
|
||
border-radius: var(--radius-sm);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
border: none;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.cancelButton-Lu0me9:hover, .cancelButton-Lu0me9:active {
|
||
background: var(--bg-bg-overlay-l3);
|
||
}
|
||
|
||
.cancelButton-Lu0me9:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.cancelText-j1RS1q {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
white-space: nowrap;
|
||
padding: 0 var(--spacing-xs);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.submitButton-BqyEd7 {
|
||
height: 24px;
|
||
padding: 0 var(--spacing-sm);
|
||
background: var(--bg-bg-invert);
|
||
border-radius: var(--radius-sm);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
border: none;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.submitButton-BqyEd7:hover:not(:disabled) {
|
||
background: var(--bg-bg-invert-hover);
|
||
}
|
||
|
||
.submitButton-BqyEd7:active:not(:disabled) {
|
||
background: var(--bg-bg-invert-active);
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled {
|
||
background: var(--bg-bg-invert-disabled);
|
||
color: var(--text-text-disabled);
|
||
cursor: not-allowed;
|
||
}
|
||
|
||
.submitButton-BqyEd7:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.submitText-N58QRq {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-onaccent);
|
||
white-space: nowrap;
|
||
padding: 0 var(--spacing-xs);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled .submitText-N58QRq {
|
||
color: var(--text-text-disabled);
|
||
}
|
||
|
||
.submitIcon-vyKSKQ {
|
||
width: 12px;
|
||
height: 12px;
|
||
color: var(--icon-icon-onaccent);
|
||
flex-shrink: 0;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled .submitIcon-vyKSKQ {
|
||
color: var(--text-text-disabled);
|
||
}
|
||
|
||
.limitWarning-Hocj0v {
|
||
align-items: center;
|
||
gap: var(--spacing-xs);
|
||
color: var(--status-warning-default);
|
||
user-select: none;
|
||
flex: 1;
|
||
display: flex;
|
||
}
|
||
|
||
.limitText-hBXEaq {
|
||
font-family: var(--font-family-default);
|
||
color: var(--status-warning-default);
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 18px;
|
||
}
|
||
|
||
</style><style>.previewCommentCardContainer-HEkpU8 {
|
||
border-radius: var(--radius-8);
|
||
background: var(--bg-bg-menu);
|
||
border: 1px solid var(--border-border-neutral-l1);
|
||
transition: width .25s cubic-bezier(.4, 0, .2, 1), height .25s cubic-bezier(.4, 0, .2, 1);
|
||
display: inline-block;
|
||
overflow: hidden;
|
||
box-shadow: 0 2px 6px #0003, 0 .5px #ffffff0f, inset 0 .5px #ffffff0f;
|
||
}
|
||
|
||
.previewCommentCardContent-ELaLah {
|
||
width: max-content;
|
||
position: relative;
|
||
}
|
||
|
||
.previewCommentCardFadeEnter-OMhMD9 {
|
||
opacity: 0;
|
||
}
|
||
|
||
.previewCommentCardFadeEnterActive-Eacuvn {
|
||
opacity: 1;
|
||
transition: opacity .2s ease-in;
|
||
}
|
||
|
||
.previewCommentCardFadeExit-ms9vgc {
|
||
opacity: 1;
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
}
|
||
|
||
.previewCommentCardFadeExitActive-vyQTsd {
|
||
opacity: 0;
|
||
transition: opacity .15s ease-out;
|
||
}
|
||
|
||
.previewCommentCardSuccessCard-PWnm2o {
|
||
white-space: nowrap;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 6px;
|
||
height: 32px;
|
||
padding: 0 12px;
|
||
display: flex;
|
||
}
|
||
|
||
.previewCommentCardSuccessIcon-Oht9Ir {
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--status-success-default);
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.previewCommentCardSuccessText-s40BWG {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
user-select: none;
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 18px;
|
||
}
|
||
|
||
</style><style id="trae-browser-inspect-drag-styles">
|
||
.trae-browser-inspect-draggable {
|
||
cursor: grab !important;
|
||
}
|
||
.trae-browser-inspect-dragging-active {
|
||
cursor: grabbing !important;
|
||
}
|
||
.trae-browser-inspect-drag-ghost {
|
||
opacity: 0.7;
|
||
pointer-events: none;
|
||
position: fixed;
|
||
z-index: 999998;
|
||
transform: scale(0.95);
|
||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
||
transition: none;
|
||
}
|
||
.trae-browser-inspect-element-placeholder {
|
||
opacity: 0.3;
|
||
}
|
||
</style><style>.trae-browser-inspect-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999997;pointer-events:auto;background:rgba(0,0,0,0)}.trae-browser-inspect-highlight-box{position:absolute;top:0;left:0;z-index:999998;display:none}.trae-browser-inspect-highlight-tag{position:absolute;left:0px;top:0px;height:18px;padding:0 6px;box-sizing:border-box;border-radius:4px;background-color:var(--vscode-icube-colorSuccessHover, "#2FB287");color:var(--vscode-icube-colorSnow, "#fff");font-size:12px;font-weight:400;display:none;align-items:center;z-index:999999}.trae-browser-inspect-highlight-box-show{display:flex}.trae-browser-inspect-select-button.trae-browser-inspect-highlight-box-show{display:flex !important}.trae-browser-inspect-select-button{position:absolute;top:0;left:0;background-color:var(--vscode-icube--bg-bg-base-secondary, "#222427");color:var(--vscode-icube--text-text-default-active, "#F5F9FE");font-size:11px;font-weight:500;border:1px solid var(--vscode-icube--border-neutral-l1, "#E0E2F217");border-radius:6px;padding:0 8px;height:32px;display:none;align-items:center;cursor:pointer;z-index:999999;gap:4px}.trae-browser-inspect-select-button svg,.trae-browser-inspect-select-button span{z-index:1}.trae-browser-inspect-select-highlight-box{background:rgba(0,0,0,0) !important}.trae-browser-inspect-select-highlight-box .trae-browser-inspect-highlight-tag{background-color:var(--vscode-icube--status-success-active, "#1E8B56")}.trae-browser-inspect-comment-card-container{position:fixed;top:0;left:0;z-index:9999999;pointer-events:auto}.trae-browser-inspect-comment-card-container .trae-browser-inspect-comment-card{display:flex;padding-top:0px !important;align-items:center;z-index:9999999 !important;background-color:var(--vscode-icube--bg-bg-menu)}*[contenteditable]{outline:none}.trae-browser-inspect-click-effect{position:fixed;width:40px;height:40px;margin-left:-20px;margin-top:-20px;border-radius:50%;background-color:var(--vscode-icube-colorSuccessHover, #2FB287);pointer-events:none;animation:trae-browser-inspect-ripple 500ms ease-out forwards;z-index:999999}@keyframes trae-browser-inspect-ripple{0%{transform:scale(0.3);opacity:.8}100%{transform:scale(2);opacity:0}}.trae-browser-inspect-ref-box{position:absolute;border:2px solid var(--vscode-icube-colorSuccessHover, "#2FB287");pointer-events:none;z-index:999998;animation:trae-browser-inspect-fadeInOut 2s ease-in-out forwards}.trae-browser-inspect-ref-label{position:absolute;top:-14px;left:0;height:14px;padding:0 4px;box-sizing:border-box;border-radius:2px;background-color:var(--vscode-icube-colorSuccessHover, "#2FB287");color:var(--vscode-icube-colorSnow, "#fff");font-size:9px;font-weight:500;display:flex;align-items:center;white-space:nowrap;z-index:999999}@keyframes trae-browser-inspect-fadeInOut{0%{opacity:0}10%{opacity:1}90%{opacity:1}100%{opacity:0}}.trae-browser-inspect-input-highlight{position:absolute;border:2px solid var(--vscode-icube-colorSuccessHover, "#2FB287");border-radius:4px;pointer-events:none;z-index:999998;box-shadow:0 0 8px var(--vscode-icube-colorSuccessHover, "#2FB287");animation:trae-browser-inspect-input-pulse 600ms ease-out forwards}@keyframes trae-browser-inspect-input-pulse{0%{opacity:0;box-shadow:0 0 0 var(--vscode-icube-colorSuccessHover, "#2FB287")}30%{opacity:1;box-shadow:0 0 12px var(--vscode-icube-colorSuccessHover, "#2FB287")}100%{opacity:0;box-shadow:0 0 0 var(--vscode-icube-colorSuccessHover, "#2FB287")}}.trae-browser-inspect-virtual-cursor{position:fixed;width:20px;height:20px;pointer-events:none;z-index:9999999;opacity:0;transition:opacity .2s ease}.trae-browser-inspect-virtual-cursor.trae-browser-inspect-cursor-visible{opacity:1}.trae-browser-inspect-virtual-cursor.trae-browser-inspect-cursor-idle{animation:trae-browser-inspect-cursor-breathe 2s ease-in-out infinite}.trae-browser-inspect-virtual-cursor svg{width:20px;height:20px;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3))}@keyframes trae-browser-inspect-cursor-breathe{0%,100%{opacity:.7}50%{opacity:1}}.trae-browser-inspect-scroll-indicator{position:fixed;display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;border-radius:8px;background-color:rgba(0,0,0,.7);color:#fff;font-size:13px;font-weight:500;pointer-events:none;z-index:999999;animation:trae-browser-inspect-indicator-fade 800ms ease-out forwards;backdrop-filter:blur(4px)}.trae-browser-inspect-scroll-indicator svg{width:16px;height:16px;fill:#fff}.trae-browser-inspect-scroll-indicator.trae-scroll-up{top:12px;left:50%;transform:translateX(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-down{bottom:12px;left:50%;transform:translateX(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-left{left:12px;top:50%;transform:translateY(-50%)}.trae-browser-inspect-scroll-indicator.trae-scroll-right{right:12px;top:50%;transform:translateY(-50%)}@keyframes trae-browser-inspect-indicator-fade{0%{opacity:0;transform:translateX(-50%) scale(0.9)}15%{opacity:1;transform:translateX(-50%) scale(1)}85%{opacity:1}100%{opacity:0}}.trae-browser-inspect-scroll-indicator.trae-scroll-left,.trae-browser-inspect-scroll-indicator.trae-scroll-right{animation-name:trae-browser-inspect-indicator-fade-y}@keyframes trae-browser-inspect-indicator-fade-y{0%{opacity:0;transform:translateY(-50%) scale(0.9)}15%{opacity:1;transform:translateY(-50%) scale(1)}85%{opacity:1}100%{opacity:0}}.trae-browser-inspect-key-badge{position:fixed;bottom:60px;left:50%;transform:translateX(-50%);padding:8px 20px;border-radius:8px;background-color:rgba(0,0,0,.8);color:#fff;font-size:18px;font-weight:600;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,monospace;pointer-events:none;z-index:999999;animation:trae-browser-inspect-key-pop 500ms ease-out forwards;backdrop-filter:blur(4px);border:1px solid hsla(0,0%,100%,.15);box-shadow:0 4px 12px rgba(0,0,0,.3);letter-spacing:1px}@keyframes trae-browser-inspect-key-pop{0%{opacity:0;transform:translateX(-50%) translateY(10px) scale(0.9)}20%{opacity:1;transform:translateX(-50%) translateY(0) scale(1)}80%{opacity:1}100%{opacity:0;transform:translateX(-50%) translateY(-10px)}}.trae-browser-inspect-step-badge{position:fixed;top:12px;left:12px;padding:6px 12px;border-radius:6px;background-color:var(--vscode-icube-colorSuccessHover, #2FB287);color:#fff;font-size:12px;font-weight:600;pointer-events:none;z-index:999999;animation:trae-browser-inspect-step-slide 600ms ease-out forwards;box-shadow:0 2px 8px rgba(47,178,135,.3);max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.trae-browser-inspect-step-badge.trae-step-old{opacity:.4;transform:translateY(0)}@keyframes trae-browser-inspect-step-slide{0%{opacity:0;transform:translateX(-20px)}20%{opacity:1;transform:translateX(0)}100%{opacity:1;transform:translateX(0)}}.trae-browser-inspect-drag-trail{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:999998}.trae-browser-inspect-drag-trail svg{width:100%;height:100%}.trae-browser-inspect-drag-trail .trae-drag-path{fill:none;stroke:var(--vscode-icube-colorSuccessHover, #2FB287);stroke-width:2;stroke-dasharray:8 4;opacity:.6;animation:trae-browser-inspect-dash 600ms linear forwards}.trae-browser-inspect-drag-trail .trae-drag-dot{fill:var(--vscode-icube-colorSuccessHover, #2FB287);filter:drop-shadow(0 0 4px rgba(47, 178, 135, 0.6))}.trae-browser-inspect-drag-trail .trae-drag-endpoint{fill:none;stroke:var(--vscode-icube-colorSuccessHover, #2FB287);stroke-width:2;opacity:.5}@keyframes trae-browser-inspect-dash{0%{stroke-dashoffset:200}100%{stroke-dashoffset:0}}.trae-browser-inspect-drag-trail.trae-drag-fade{animation:trae-browser-inspect-trail-fade 400ms ease-out forwards}@keyframes trae-browser-inspect-trail-fade{0%{opacity:1}100%{opacity:0}}</style><script type="module">(async () => {
|
||
try {
|
||
const client = await import('/@vite/client');
|
||
const hmr = client.createHotContext('hmr-handler/fake.js');
|
||
hmr.on('vite:afterUpdate', window['__ICUBE_WEBVIEW_HMR_CALLBACK_1786004552734']);
|
||
} catch {}
|
||
})();</script><style>.buttonsCard-bTXa5j {
|
||
padding: var(--spacer-4);
|
||
background: none;
|
||
align-items: center;
|
||
gap: 0;
|
||
display: inline-flex;
|
||
}
|
||
|
||
.actionButton-opZL8g {
|
||
align-items: center;
|
||
gap: var(--spacer-4);
|
||
padding: var(--spacer-4) var(--spacer-8);
|
||
border-radius: var(--radius-4);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
background: none;
|
||
border: none;
|
||
display: inline-flex;
|
||
}
|
||
|
||
.actionButton-opZL8g:hover {
|
||
background: var(--bg-bg-overlay-l2);
|
||
}
|
||
|
||
.actionButton-opZL8g:active {
|
||
background: var(--bg-bg-overlay-l3);
|
||
}
|
||
|
||
.actionButton-opZL8g:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.icon-ObJEMt {
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--icon-icon-default);
|
||
flex-shrink: 0;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.title-GptGAg {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
white-space: nowrap;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.shortcut-nbwTG4 {
|
||
color: var(--icon-icon-secondary);
|
||
flex-shrink: 0;
|
||
align-items: center;
|
||
gap: 2px;
|
||
display: flex;
|
||
}
|
||
|
||
.shortcutKey-EE6xrE {
|
||
font-family: var(--font-family-default);
|
||
color: var(--icon-icon-secondary);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 12px;
|
||
}
|
||
|
||
.divider-cFGVKQ {
|
||
box-sizing: content-box;
|
||
background-clip: content-box;
|
||
background-color: var(--border-border-neutral-l2);
|
||
flex-shrink: 0;
|
||
width: 1px;
|
||
height: 12px;
|
||
padding: 0 6px;
|
||
}
|
||
|
||
</style><style>.commentEditorCard-Un4Xaa {
|
||
width: 320px;
|
||
padding: var(--spacing-sm);
|
||
background: none;
|
||
flex-direction: column;
|
||
display: flex;
|
||
}
|
||
|
||
.textContainer-ZISwbW {
|
||
padding: var(--spacing-sm);
|
||
background: var(--bg-bg-overlay-l1);
|
||
border: 1px solid var(--border-border-neutral-l3);
|
||
border-radius: var(--radius-sm);
|
||
align-items: center;
|
||
gap: var(--spacing-sm);
|
||
padding-right: 0;
|
||
display: flex;
|
||
}
|
||
|
||
.textarea-ggj4j6 {
|
||
padding: 0 var(--spacing-sm) 0 2px;
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
resize: none;
|
||
scrollbar-width: thin;
|
||
scrollbar-color: #56637726 transparent;
|
||
background: none;
|
||
border: none;
|
||
outline: none;
|
||
flex: 1;
|
||
max-height: 140px;
|
||
font-size: 13px;
|
||
font-weight: 400;
|
||
line-height: 20px;
|
||
overflow-y: auto;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar {
|
||
width: 6px;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar-track {
|
||
background: none;
|
||
}
|
||
|
||
.textarea-ggj4j6::-webkit-scrollbar-thumb {
|
||
background: #56637726;
|
||
border-radius: 3px;
|
||
}
|
||
|
||
.textarea-ggj4j6::placeholder {
|
||
color: var(--text-text-tertiary);
|
||
}
|
||
|
||
.actionBar-u_t8vc {
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
gap: var(--spacing-xs);
|
||
opacity: 0;
|
||
max-height: 0;
|
||
transition: max-height .2s ease-out, opacity .2s ease-out, margin-top .2s ease-out;
|
||
display: flex;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.actionBarVisible-PxXsje {
|
||
opacity: 1;
|
||
max-height: 32px;
|
||
margin-top: var(--spacing-sm);
|
||
}
|
||
|
||
.actionBarNoExpandAnimation-FCra2J {
|
||
transition: opacity .2s ease-out;
|
||
}
|
||
|
||
.actionBarNoExpandAnimation-FCra2J.actionBarVisible-PxXsje {
|
||
max-height: 32px;
|
||
margin-top: var(--spacing-sm);
|
||
}
|
||
|
||
.cancelButton-Lu0me9 {
|
||
height: 24px;
|
||
padding: 0 var(--spacing-xs);
|
||
background: var(--bg-bg-overlay-l2);
|
||
border-radius: var(--radius-sm);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
border: none;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.cancelButton-Lu0me9:hover, .cancelButton-Lu0me9:active {
|
||
background: var(--bg-bg-overlay-l3);
|
||
}
|
||
|
||
.cancelButton-Lu0me9:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.cancelText-j1RS1q {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
white-space: nowrap;
|
||
padding: 0 var(--spacing-xs);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.submitButton-BqyEd7 {
|
||
height: 24px;
|
||
padding: 0 var(--spacing-sm);
|
||
background: var(--bg-bg-invert);
|
||
border-radius: var(--radius-sm);
|
||
cursor: pointer;
|
||
transition: background-color var(--transition-fast);
|
||
border: none;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.submitButton-BqyEd7:hover:not(:disabled) {
|
||
background: var(--bg-bg-invert-hover);
|
||
}
|
||
|
||
.submitButton-BqyEd7:active:not(:disabled) {
|
||
background: var(--bg-bg-invert-active);
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled {
|
||
background: var(--bg-bg-invert-disabled);
|
||
color: var(--text-text-disabled);
|
||
cursor: not-allowed;
|
||
}
|
||
|
||
.submitButton-BqyEd7:focus-visible {
|
||
outline: 2px solid var(--status-primary-default);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.submitText-N58QRq {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-onaccent);
|
||
white-space: nowrap;
|
||
padding: 0 var(--spacing-xs);
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled .submitText-N58QRq {
|
||
color: var(--text-text-disabled);
|
||
}
|
||
|
||
.submitIcon-vyKSKQ {
|
||
width: 12px;
|
||
height: 12px;
|
||
color: var(--icon-icon-onaccent);
|
||
flex-shrink: 0;
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.submitButton-BqyEd7:disabled .submitIcon-vyKSKQ {
|
||
color: var(--text-text-disabled);
|
||
}
|
||
|
||
.limitWarning-Hocj0v {
|
||
align-items: center;
|
||
gap: var(--spacing-xs);
|
||
color: var(--status-warning-default);
|
||
user-select: none;
|
||
flex: 1;
|
||
display: flex;
|
||
}
|
||
|
||
.limitText-hBXEaq {
|
||
font-family: var(--font-family-default);
|
||
color: var(--status-warning-default);
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 18px;
|
||
}
|
||
|
||
</style><style>.previewCommentCardContainer-HEkpU8 {
|
||
border-radius: var(--radius-8);
|
||
background: var(--bg-bg-menu);
|
||
border: 1px solid var(--border-border-neutral-l1);
|
||
transition: width .25s cubic-bezier(.4, 0, .2, 1), height .25s cubic-bezier(.4, 0, .2, 1);
|
||
display: inline-block;
|
||
overflow: hidden;
|
||
box-shadow: 0 2px 6px #0003, 0 .5px #ffffff0f, inset 0 .5px #ffffff0f;
|
||
}
|
||
|
||
.previewCommentCardContent-ELaLah {
|
||
width: max-content;
|
||
position: relative;
|
||
}
|
||
|
||
.previewCommentCardFadeEnter-OMhMD9 {
|
||
opacity: 0;
|
||
}
|
||
|
||
.previewCommentCardFadeEnterActive-Eacuvn {
|
||
opacity: 1;
|
||
transition: opacity .2s ease-in;
|
||
}
|
||
|
||
.previewCommentCardFadeExit-ms9vgc {
|
||
opacity: 1;
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
}
|
||
|
||
.previewCommentCardFadeExitActive-vyQTsd {
|
||
opacity: 0;
|
||
transition: opacity .15s ease-out;
|
||
}
|
||
|
||
.previewCommentCardSuccessCard-PWnm2o {
|
||
white-space: nowrap;
|
||
justify-content: center;
|
||
align-items: center;
|
||
gap: 6px;
|
||
height: 32px;
|
||
padding: 0 12px;
|
||
display: flex;
|
||
}
|
||
|
||
.previewCommentCardSuccessIcon-Oht9Ir {
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--status-success-default);
|
||
justify-content: center;
|
||
align-items: center;
|
||
display: flex;
|
||
}
|
||
|
||
.previewCommentCardSuccessText-s40BWG {
|
||
font-family: var(--font-family-default);
|
||
color: var(--text-text-default);
|
||
user-select: none;
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 18px;
|
||
}
|
||
|
||
</style><style id="icube-theme-variables">:root {--vscode-foreground: #31353a;--vscode-disabledForeground: #8a9096;--vscode-errorForeground: #cc4b53;--vscode-descriptionForeground: #5b6066;--vscode-icon-foreground: #5b6066;--vscode-focusBorder: rgba(0, 0, 0, 0);--vscode-textLink-foreground: #006ab1;--vscode-textLink-activeForeground: #387bff;--vscode-textSeparator-foreground: rgba(0, 0, 0, 0.18);--vscode-textPreformat-foreground: #a31515;--vscode-textPreformat-background: rgba(0, 0, 0, 0.1);--vscode-textBlockQuote-background: #f2f2f2;--vscode-textBlockQuote-border: rgba(0, 122, 204, 0.5);--vscode-textCodeBlock-background: rgba(220, 220, 220, 0.4);--vscode-sash-hoverBorder: #0fdc78;--vscode-badge-background: #c4c4c4;--vscode-badge-foreground: #333333;--vscode-activityWarningBadge-foreground: #ffffff;--vscode-activityWarningBadge-background: #b27c00;--vscode-activityErrorBadge-foreground: #ffffff;--vscode-activityErrorBadge-background: #e51400;--vscode-scrollbar-shadow: #dddddd;--vscode-scrollbarSlider-background: rgba(100, 100, 100, 0.4);--vscode-scrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);--vscode-scrollbarSlider-activeBackground: rgba(0, 0, 0, 0.6);--vscode-progressBar-background: #2f74ff;--vscode-chart-line: #236b8e;--vscode-chart-axis: rgba(0, 0, 0, 0.6);--vscode-chart-guide: rgba(0, 0, 0, 0.2);--vscode-editor-background: #ffffff;--vscode-editor-foreground: #31353a;--vscode-editorStickyScroll-background: #ffffff;--vscode-editorStickyScrollGutter-background: #ffffff;--vscode-editorStickyScrollHover-background: rgba(91, 146, 255, 0.08);--vscode-editorStickyScroll-shadow: #dddddd;--vscode-editorWidget-background: #f3f3f3;--vscode-editorWidget-foreground: #31353a;--vscode-editorWidget-border: #c8c8c8;--vscode-editorError-foreground: #e51400;--vscode-editorWarning-foreground: #bf8803;--vscode-editorInfo-foreground: #0063d3;--vscode-editorHint-foreground: #6c6c6c;--vscode-editorLink-activeForeground: #36393d;--vscode-editor-selectionBackground: rgba(47, 116, 255, 0.18);--vscode-editor-inactiveSelectionBackground: #e5ebf1;--vscode-editor-selectionHighlightBackground: rgba(173, 214, 255, 0.5);--vscode-editor-compositionBorder: #000000;--vscode-editor-findMatchBackground: #a8ac94;--vscode-editor-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);--vscode-editor-findRangeHighlightBackground: rgba(180, 180, 180, 0.3);--vscode-editor-hoverHighlightBackground: rgba(173, 214, 255, 0.15);--vscode-editorHoverWidget-background: #ffffff;--vscode-editorHoverWidget-foreground: #31353a;--vscode-editorHoverWidget-border: rgba(77, 107, 153, 0.09);--vscode-editorHoverWidget-statusBarBackground: #f2f2f2;--vscode-editorInlayHint-foreground: #969696;--vscode-editorInlayHint-background: rgba(196, 196, 196, 0.1);--vscode-editorInlayHint-typeForeground: #969696;--vscode-editorInlayHint-typeBackground: rgba(196, 196, 196, 0.1);--vscode-editorInlayHint-parameterForeground: #969696;--vscode-editorInlayHint-parameterBackground: rgba(196, 196, 196, 0.1);--vscode-editorLightBulb-foreground: #ddb100;--vscode-editorLightBulbAutoFix-foreground: #007acc;--vscode-editorLightBulbAi-foreground: #ddb100;--vscode-editor-snippetTabstopHighlightBackground: rgba(10, 50, 100, 0.2);--vscode-editor-snippetFinalTabstopHighlightBorder: rgba(10, 50, 100, 0.5);--vscode-diffEditor-insertedTextBackground: rgba(64, 176, 139, 0.18);--vscode-diffEditor-removedTextBackground: rgba(232, 70, 58, 0.16);--vscode-diffEditor-insertedLineBackground: rgba(64, 176, 139, 0.12);--vscode-diffEditor-removedLineBackground: rgba(232, 70, 58, 0.12);--vscode-diffEditorOverview-insertedForeground: rgba(64, 176, 139, 0.18);--vscode-diffEditorOverview-removedForeground: rgba(232, 70, 58, 0.16);--vscode-diffEditor-diagonalFill: rgba(34, 34, 34, 0.2);--vscode-diffEditor-unchangedRegionBackground: #ffffff;--vscode-diffEditor-unchangedRegionForeground: #31353a;--vscode-diffEditor-unchangedCodeBackground: rgba(184, 184, 184, 0.16);--vscode-widget-shadow: rgba(0, 0, 0, 0.08);--vscode-widget-border: rgba(77, 107, 153, 0.09);--vscode-toolbar-hoverBackground: rgba(86, 99, 119, 0.11);--vscode-toolbar-activeBackground: rgba(86, 99, 119, 0.15);--vscode-breadcrumb-foreground: rgba(49, 53, 58, 0.8);--vscode-breadcrumb-background: #ffffff;--vscode-breadcrumb-focusForeground: #272a2e;--vscode-breadcrumb-activeSelectionForeground: #272a2e;--vscode-breadcrumbPicker-background: #ffffff;--vscode-merge-currentHeaderBackground: rgba(64, 200, 174, 0.5);--vscode-merge-currentContentBackground: rgba(64, 200, 174, 0.2);--vscode-merge-incomingHeaderBackground: rgba(64, 166, 255, 0.5);--vscode-merge-incomingContentBackground: rgba(64, 166, 255, 0.2);--vscode-merge-commonHeaderBackground: rgba(96, 96, 96, 0.4);--vscode-merge-commonContentBackground: rgba(96, 96, 96, 0.16);--vscode-editorOverviewRuler-currentContentForeground: rgba(64, 200, 174, 0.5);--vscode-editorOverviewRuler-incomingContentForeground: rgba(64, 166, 255, 0.5);--vscode-editorOverviewRuler-commonContentForeground: rgba(96, 96, 96, 0.4);--vscode-editorOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);--vscode-editorOverviewRuler-selectionHighlightForeground: rgba(160, 160, 160, 0.8);--vscode-problemsErrorIcon-foreground: #e51400;--vscode-problemsWarningIcon-foreground: #bf8803;--vscode-problemsInfoIcon-foreground: #0063d3;--vscode-minimap-findMatchHighlight: #d18616;--vscode-minimap-selectionOccurrenceHighlight: #c9c9c9;--vscode-minimap-selectionHighlight: #add6ff;--vscode-minimap-infoHighlight: #0063d3;--vscode-minimap-warningHighlight: #bf8803;--vscode-minimap-errorHighlight: rgba(255, 18, 18, 0.7);--vscode-minimap-foregroundOpacity: #000000;--vscode-minimapSlider-background: rgba(100, 100, 100, 0.2);--vscode-minimapSlider-hoverBackground: rgba(100, 100, 100, 0.35);--vscode-minimapSlider-activeBackground: rgba(0, 0, 0, 0.3);--vscode-charts-foreground: #31353a;--vscode-charts-lines: rgba(49, 53, 58, 0.5);--vscode-charts-red: #e51400;--vscode-charts-blue: #0063d3;--vscode-charts-yellow: #bf8803;--vscode-charts-orange: #d18616;--vscode-charts-green: #388a34;--vscode-charts-purple: #652d90;--vscode-input-background: rgba(86, 99, 119, 0.07);--vscode-input-foreground: #31353a;--vscode-inputOption-activeBorder: rgba(77, 107, 153, 0.36);--vscode-inputOption-hoverBackground: rgba(184, 184, 184, 0.31);--vscode-inputOption-activeBackground: rgba(0, 0, 0, 0);--vscode-inputOption-activeForeground: #000000;--vscode-input-placeholderForeground: #5b6066;--vscode-inputValidation-infoBackground: #d6ecf2;--vscode-inputValidation-infoBorder: #007acc;--vscode-inputValidation-warningBackground: #f6f5d2;--vscode-inputValidation-warningBorder: #b89500;--vscode-inputValidation-errorBackground: #f2dede;--vscode-inputValidation-errorBorder: #e8463a;--vscode-dropdown-background: #ffffff;--vscode-dropdown-foreground: #31353a;--vscode-dropdown-border: #cecece;--vscode-button-foreground: #ffffff;--vscode-button-separator: rgba(193, 195, 205, 0.12);--vscode-button-background: #31353a;--vscode-button-hoverBackground: #72767b;--vscode-button-secondaryForeground: #ffffff;--vscode-button-secondaryBackground: #5f6a79;--vscode-button-secondaryHoverBackground: #4c5561;--vscode-radio-activeForeground: #000000;--vscode-radio-activeBackground: rgba(0, 0, 0, 0);--vscode-radio-activeBorder: rgba(77, 107, 153, 0.36);--vscode-radio-inactiveBorder: rgba(0, 0, 0, 0.2);--vscode-radio-inactiveHoverBackground: rgba(184, 184, 184, 0.31);--vscode-checkbox-background: #ffffff;--vscode-checkbox-selectBackground: #f3f3f3;--vscode-checkbox-foreground: #31353a;--vscode-checkbox-border: #919191;--vscode-checkbox-selectBorder: #5b6066;--vscode-checkbox-disabled.background: #bbbcbd;--vscode-checkbox-disabled.foreground: #74777b;--vscode-keybindingLabel-background: rgba(221, 221, 221, 0.4);--vscode-keybindingLabel-foreground: #555555;--vscode-keybindingLabel-border: rgba(204, 204, 204, 0.4);--vscode-keybindingLabel-bottomBorder: rgba(187, 187, 187, 0.4);--vscode-list-focusOutline: rgba(0, 0, 0, 0);--vscode-list-focusAndSelectionOutline: #90c2f9;--vscode-list-activeSelectionBackground: rgba(86, 99, 119, 0.11);--vscode-list-activeSelectionForeground: #111214;--vscode-list-activeSelectionIconForeground: #5b6066;--vscode-list-inactiveSelectionBackground: rgba(86, 99, 119, 0.11);--vscode-list-inactiveSelectionForeground: #111214;--vscode-list-hoverBackground: rgba(86, 99, 119, 0.11);--vscode-list-dropBackground: rgba(86, 99, 119, 0.11);--vscode-list-dropBetweenBackground: #5b6066;--vscode-list-highlightForeground: #0066bf;--vscode-list-focusHighlightForeground: #0066bf;--vscode-list-invalidItemForeground: #b89500;--vscode-list-errorForeground: #e8463a;--vscode-list-warningForeground: #855f00;--vscode-listFilterWidget-background: #f3f3f3;--vscode-listFilterWidget-outline: rgba(0, 0, 0, 0);--vscode-listFilterWidget-noMatchesOutline: #be1100;--vscode-listFilterWidget-shadow: rgba(0, 0, 0, 0.08);--vscode-list-filterMatchBackground: rgba(234, 92, 0, 0.33);--vscode-list-deemphasizedForeground: #8e8e90;--vscode-tree-indentGuidesStroke: rgba(77, 107, 153, 0.09);--vscode-tree-inactiveIndentGuidesStroke: rgba(221, 226, 233, 0.08);--vscode-tree-tableColumnsBorder: rgba(97, 97, 97, 0.13);--vscode-tree-tableOddRowsBackground: rgba(49, 53, 58, 0.04);--vscode-editorActionList-background: #f3f3f3;--vscode-editorActionList-foreground: #31353a;--vscode-editorActionList-focusForeground: #111214;--vscode-editorActionList-focusBackground: rgba(86, 99, 119, 0.11);--vscode-menu-border: rgba(77, 107, 153, 0.09);--vscode-menu-foreground: #616161;--vscode-menu-background: #ffffff;--vscode-menu-selectionForeground: #111214;--vscode-menu-selectionBackground: rgba(86, 99, 119, 0.11);--vscode-menu-separatorBackground: rgba(77, 107, 153, 0.09);--vscode-quickInput-background: #f8f9fa;--vscode-quickInput-foreground: #31353a;--vscode-quickInputTitle-background: rgba(0, 0, 0, 0.04);--vscode-pickerGroup-foreground: #31353a;--vscode-pickerGroup-border: rgba(77, 107, 153, 0.09);--vscode-quickInputList-focusForeground: #111214;--vscode-quickInputList-focusIconForeground: #5b6066;--vscode-quickInputList-focusBackground: rgba(86, 99, 119, 0.11);--vscode-search-resultsInfoForeground: #31353a;--vscode-searchEditor-findMatchBackground: rgba(234, 92, 0, 0.22);--vscode-tab-activeBackground: rgba(86, 99, 119, 0.11);--vscode-tab-unfocusedActiveBackground: rgba(86, 99, 119, 0.11);--vscode-tab-inactiveBackground: #f8f8f9;--vscode-tab-unfocusedInactiveBackground: #f8f8f9;--vscode-tab-activeForeground: #333333;--vscode-tab-inactiveForeground: #5b6066;--vscode-tab-unfocusedActiveForeground: #31353a;--vscode-tab-unfocusedInactiveForeground: rgba(91, 96, 102, 0.5);--vscode-tab-border: rgba(77, 107, 153, 0.09);--vscode-tab-lastPinnedBorder: rgba(97, 97, 97, 0.19);--vscode-tab-activeBorder: #ffffff;--vscode-tab-unfocusedActiveBorder: rgba(255, 255, 255, 0.7);--vscode-tab-activeBorderTop: #000000;--vscode-tab-unfocusedActiveBorderTop: rgba(0, 0, 0, 0.7);--vscode-tab-selectedBorderTop: #000000;--vscode-tab-selectedBackground: rgba(86, 99, 119, 0.11);--vscode-tab-selectedForeground: #333333;--vscode-tab-dragAndDropBorder: #333333;--vscode-tab-activeModifiedBorder: #33aaee;--vscode-tab-inactiveModifiedBorder: rgba(51, 170, 238, 0.5);--vscode-tab-unfocusedActiveModifiedBorder: rgba(51, 170, 238, 0.7);--vscode-tab-unfocusedInactiveModifiedBorder: rgba(51, 170, 238, 0.25);--vscode-editorPane-background: #ffffff;--vscode-editorGroupHeader-tabsBackground: #f8f8f9;--vscode-editorGroupHeader-tabsBorder: rgba(77, 107, 153, 0.09);--vscode-editorGroupHeader-noTabsBackground: #ffffff;--vscode-editorGroup-border: #e7e7e7;--vscode-editorGroup-dropBackground: rgba(33, 97, 224, 0.16);--vscode-editorGroup-dropIntoPromptForeground: #31353a;--vscode-editorGroup-dropIntoPromptBackground: #f3f3f3;--vscode-sideBySideEditor-horizontalBorder: #e7e7e7;--vscode-sideBySideEditor-verticalBorder: #e7e7e7;--vscode-panel-background: #ffffff;--vscode-panel-border: rgba(128, 128, 128, 0.35);--vscode-panelTitle-activeForeground: #111214;--vscode-panelTitle-inactiveForeground: #5b6066;--vscode-panelTitle-activeBorder: #111214;--vscode-panelInput-border: #dddddd;--vscode-panel-dropBorder: #111214;--vscode-panelSection-dropBackground: rgba(33, 97, 224, 0.16);--vscode-panelSectionHeader-background: #ffffff;--vscode-panelSectionHeader-foreground: #111214;--vscode-panelSectionHeader-border: rgba(77, 107, 153, 0.18);--vscode-panelSection-border: rgba(128, 128, 128, 0.35);--vscode-panelStickyScroll-background: #ffffff;--vscode-panelStickyScroll-shadow: #dddddd;--vscode-banner-background: rgba(60, 69, 83, 0.11);--vscode-banner-foreground: #111214;--vscode-banner-iconForeground: #0063d3;--vscode-statusBar-foreground: #ffffff;--vscode-statusBar-noFolderForeground: #ffffff;--vscode-statusBar-background: rgba(0, 0, 0, 0);--vscode-statusBar-noFolderBackground: rgba(0, 0, 0, 0);--vscode-statusBar-focusBorder: #ffffff;--vscode-statusBarItem-activeBackground: rgba(255, 255, 255, 0.18);--vscode-statusBarItem-focusBorder: #ffffff;--vscode-statusBarItem-hoverBackground: rgba(0, 0, 0, 0.12);--vscode-statusBarItem-hoverForeground: #ffffff;--vscode-statusBarItem-compactHoverBackground: rgba(0, 0, 0, 0.12);--vscode-statusBarItem-prominentForeground: #ffffff;--vscode-statusBarItem-prominentBackground: rgba(0, 0, 0, 0.5);--vscode-statusBarItem-prominentHoverForeground: #ffffff;--vscode-statusBarItem-prominentHoverBackground: rgba(0, 0, 0, 0.12);--vscode-statusBarItem-errorBackground: #c72e0f;--vscode-statusBarItem-errorForeground: #ffffff;--vscode-statusBarItem-errorHoverForeground: #ffffff;--vscode-statusBarItem-errorHoverBackground: rgba(0, 0, 0, 0.12);--vscode-statusBarItem-warningBackground: #725102;--vscode-statusBarItem-warningForeground: #ffffff;--vscode-statusBarItem-warningHoverForeground: #ffffff;--vscode-statusBarItem-warningHoverBackground: rgba(0, 0, 0, 0.12);--vscode-activityBar-background: #edeff2;--vscode-activityBar-foreground: #111214;--vscode-activityBar-inactiveForeground: #5b6066;--vscode-activityBar-activeBorder: #111214;--vscode-activityBar-dropBorder: #111214;--vscode-activityBarBadge-background: #2f74ff;--vscode-activityBarBadge-foreground: #ffffff;--vscode-activityBarTop-foreground: #424242;--vscode-activityBarTop-activeBorder: #424242;--vscode-activityBarTop-inactiveForeground: rgba(66, 66, 66, 0.75);--vscode-activityBarTop-dropBorder: #424242;--vscode-profileBadge-background: #c4c4c4;--vscode-profileBadge-foreground: #333333;--vscode-statusBarItem-remoteBackground: #16825d;--vscode-statusBarItem-remoteForeground: #ffffff;--vscode-statusBarItem-remoteHoverForeground: #ffffff;--vscode-statusBarItem-remoteHoverBackground: rgba(0, 0, 0, 0.12);--vscode-statusBarItem-offlineBackground: #6c1717;--vscode-statusBarItem-offlineForeground: #ffffff;--vscode-statusBarItem-offlineHoverForeground: #ffffff;--vscode-statusBarItem-offlineHoverBackground: rgba(0, 0, 0, 0.12);--vscode-extensionBadge-remoteBackground: #2f74ff;--vscode-extensionBadge-remoteForeground: #ffffff;--vscode-sideBar-background: #ffffff;--vscode-sideBarTitle-background: #ffffff;--vscode-sideBarTitle-foreground: #6f6f6f;--vscode-sideBar-dropBackground: rgba(33, 97, 224, 0.16);--vscode-sideBarSectionHeader-background: #ffffff;--vscode-sideBarSectionHeader-foreground: #31353a;--vscode-sideBarSectionHeader-border: rgba(77, 107, 153, 0.18);--vscode-sideBarActivityBarTop-border: rgba(77, 107, 153, 0.18);--vscode-sideBarStickyScroll-background: #ffffff;--vscode-sideBarStickyScroll-shadow: #dddddd;--vscode-titleBar-activeForeground: #5b6066;--vscode-titleBar-inactiveForeground: rgba(91, 96, 102, 0.6);--vscode-titleBar-activeBackground: #edeff2;--vscode-titleBar-inactiveBackground: #edeff2;--vscode-menubar-selectionForeground: #5b6066;--vscode-menubar-selectionBackground: rgba(86, 99, 119, 0.11);--vscode-commandCenter-foreground: #5b6066;--vscode-commandCenter-activeForeground: #5b6066;--vscode-commandCenter-inactiveForeground: rgba(91, 96, 102, 0.6);--vscode-commandCenter-background: rgba(0, 0, 0, 0.05);--vscode-commandCenter-activeBackground: rgba(0, 0, 0, 0.08);--vscode-commandCenter-border: rgba(91, 96, 102, 0.2);--vscode-commandCenter-activeBorder: rgba(91, 96, 102, 0.3);--vscode-commandCenter-inactiveBorder: rgba(91, 96, 102, 0.15);--vscode-notificationCenter-border: rgba(77, 107, 153, 0.09);--vscode-notificationToast-border: rgba(77, 107, 153, 0.09);--vscode-notifications-foreground: #31353a;--vscode-notifications-background: #ffffff;--vscode-notificationLink-foreground: #006ab1;--vscode-notificationCenterHeader-background: #f2f2f2;--vscode-notifications-border: #f2f2f2;--vscode-notificationsErrorIcon-foreground: #e8463a;--vscode-notificationsWarningIcon-foreground: #e28a00;--vscode-notificationsInfoIcon-foreground: #2f74ff;--vscode-iCubeNotificationCenter-border: rgba(77, 107, 153, 0.09);--vscode-icube-colorSnow: #ffffff;--vscode-icube-colorBlack: #000000;--vscode-icube-colorSnowDisable: rgba(255, 255, 255, 0.3);--vscode-icube-modalOverlay: rgba(0, 0, 0, 0.4);--vscode-icube-colorBg1: #ffffff;--vscode-icube-colorBg2: #edeff2;--vscode-icube-colorBg3: #ffffff;--vscode-icube-colorBg4: #e1e1e1;--vscode-icube-diffColorBg3: rgba(225, 225, 225, 0.35);--vscode-icube-colorBgCode: #ffffff;--vscode-icube-colorBgTr0: rgba(86, 99, 119, 0.07);--vscode-icube-colorBtnHover: rgba(86, 99, 119, 0.11);--vscode-icube-colorBg5: rgba(77, 97, 128, 0.08);--vscode-icube-colorBtnHover2: rgba(86, 99, 119, 0.15);--vscode-icube-colorBtnTransparent3: rgba(86, 99, 119, 0.19);--vscode-icube-colorBlend: rgba(77, 97, 128, 0.12);--vscode-icube-colorTransparent: rgba(255, 255, 255, 0);--vscode-icube-colorWidgetShadow: rgba(0, 0, 0, 0.04);--vscode-icube-colorWidgetShadow2: rgba(0, 0, 0, 0.08);--vscode-icube-colorWidgetShadow3: rgba(0, 0, 0, 0.2);--vscode-icube-colorDefaultText: #31353a;--vscode-icube-colorHighlightText: #111214;--vscode-icube-colorGrayText: #5b6066;--vscode-icube-colorGrayText2: #617080;--vscode-icube-colorDisableText: #8a9096;--vscode-icube-colorBlackText: #111314;--vscode-icube-colorBlackText1: #ffffff;--vscode-icube-colorBlackText2: #000000;--vscode-icube-colorDefaultAvatar: #5b92ff;--vscode-icube-colorDefaultAvatarBackground: #1759dd;--vscode-icube-modalLayoutBg: rgba(0, 25, 49, 0.2);--vscode-icube-colorIcon: #939fb8;--vscode-icube-colorCodeCodeInstruction: #b15ef2;--vscode-icube-colorLine1: rgba(77, 107, 153, 0.09);--vscode-icube-colorLine2: rgba(77, 107, 153, 0.18);--vscode-icube-colorLine3: rgba(77, 107, 153, 0.36);--vscode-icube-colorBrand: #36393d;--vscode-icube-colorBrandHover: #72767b;--vscode-icube-colorBrandActive: #1a1b1d;--vscode-icube-colorBrandTransparent: rgba(86, 99, 119, 0.11);--vscode-icube-colorBrandTransparent2: rgba(86, 99, 119, 0.15);--vscode-icube-colorBrandTransparent3: rgba(86, 99, 119, 0.19);--vscode-icube-colorStatusRegular: #2f74ff;--vscode-icube-colorStatusRegularHover: #4c88ff;--vscode-icube-colorStatusRegularActive: #1759dd;--vscode-icube-colorStatusRegularTransparent: rgba(47, 116, 255, 0.12);--vscode-icube-colorStatusRegularTransparent2: rgba(47, 116, 255, 0.18);--vscode-icube-colorStatusRegularTransparent3: rgba(47, 116, 255, 0.36);--vscode-icube-colorSuccess: #26a57b;--vscode-icube-colorSuccessHover: #2ca77f;--vscode-icube-colorSuccessActive: #1e8b56;--vscode-icube-colorSuccessTransparent: rgba(64, 176, 139, 0.12);--vscode-icube-colorSuccessTransparent2: rgba(64, 176, 139, 0.18);--vscode-icube-colorSuccessTransparent3: rgba(64, 176, 139, 0.36);--vscode-icube-colorError: #e8463a;--vscode-icube-colorErrorHover: #ea574c;--vscode-icube-colorErrorActive: #c9382f;--vscode-icube-colorErrorTransparent: rgba(232, 70, 58, 0.12);--vscode-icube-colorErrorTransparent2: rgba(232, 70, 58, 0.16);--vscode-icube-colorErrorTransparent3: rgba(232, 70, 58, 0.36);--vscode-icube-colorWarning: #e28a00;--vscode-icube-colorWarningHover: #f18c13;--vscode-icube-colorWarningActive: #c46f11;--vscode-icube-colorWarningTransparent: rgba(226, 138, 0, 0.12);--vscode-icube-colorWarningTransparent2: rgba(226, 138, 0, 0.16);--vscode-icube-colorWarningTransparent3: rgba(226, 138, 0, 0.36);--vscode-icube-colorAlert: #c6a626;--vscode-icube-colorAlertHover: #dfb716;--vscode-icube-colorAlertActive: #af8d06;--vscode-icube-colorAlertTransparent: rgba(198, 166, 38, 0.14);--vscode-icube-colorAlertTransparent2: rgba(198, 166, 38, 0.2);--vscode-icube-colorAlertTransparent3: rgba(198, 166, 38, 0.36);--vscode-icube-colorErrorTm1: rgba(204, 75, 83, 0.2);--vscode-icube-colorErrorTr1: rgba(232, 70, 58, 0.12);--vscode-icube-colorSpinLoading: #2f74ff;--vscode-icube-colorC1: #00b983;--vscode-icube-colorC2: #ff6b45;--vscode-icube-colorC3: #f2a90c;--vscode-icube-colorC4: #5fbf00;--vscode-icube-colorC5: #00b8f8;--vscode-icube-colorC6: #3f85ff;--vscode-icube-colorC7: #f53cff;--vscode-icube-colorC8: #9570ff;--vscode-icube-colorC9: #747e94;--vscode-icube-colorDiffToggleBtnBg: #8d7aff;--vscode-icube-textPreformatBackground: #9d89eb;--vscode-icube-colorRed1: #dd3730;--vscode-icube-colorRed2: rgba(221, 55, 48, 0.1);--vscode-icube-colorRed3: #dd3730;--vscode-icube-colorGreen1: #00906e;--vscode-icube-colorDiffBtn1: #ffffff;--vscode-icube-diffInsertedTextBackground: rgba(38, 165, 123, 0.32);--vscode-icube-colorChatError: rgba(97, 97, 97, 0);--vscode-icube-chatIconBg1: #ff4a36;--vscode-icube-chatIconColor1: #ffffff;--vscode-icube-emptyExplorerButtonBgColor: rgba(77, 97, 128, 0.08);--vscode-icube-emptyExplorerButtonTextColor: #333940;--vscode-icube-emptyExplorerSplitTextColor: #333940;--vscode-icube-emptyExplorerSplitColor: rgba(77, 107, 153, 0.2);--vscode-icube-lite.colorBg1: #25252d;--vscode-icube-lite.colorBg2: #1d1c23;--vscode-icube-lite.colorLine1: #2e2e38;--vscode-widget-shadow1: rgba(0, 0, 0, 0.08);--vscode-widget-shadow2: rgba(0, 0, 0, 0.1);--vscode-widget-light.shadow1: rgba(0, 0, 0, 0.04);--vscode-widget-light.shadow2: rgba(0, 0, 0, 0.08);--vscode-icube-tooltipsTextColor: #ffffff;--vscode-icube-ai.disableInputBorderColor: rgba(77, 107, 153, 0.4);--vscode-icube-scrollbarBgColor: rgba(100, 100, 100, 0.4);--vscode-icube-scrollbarHoverBgColor: rgba(100, 100, 100, 0.4);--vscode-icube-desktopEmptyWorkspaceIconBg: rgba(77, 97, 128, 0.08);--vscode-icube-desktopEmptyWorkspaceHoverBg: rgba(77, 107, 153, 0.12);--vscode-icube--code-code-text: #17181a;--vscode-icube-primaryButtonBackground: #31353a;--vscode-icube-primaryButtonForeground: #ffffff;--vscode-icube-primaryButtonHoverBackground: #72767b;--vscode-icube-primaryButtonHoverForeground: #ffffff;--vscode-icube-primaryButtonActivateBackground: #1a1b1d;--vscode-icube-primaryButtonActivateForeground: #ffffff;--vscode-icube-primaryButtonDisableBackground: #8a9096;--vscode-icube-primaryButtonDisableForeground: #ffffff;--vscode-icube-defaultButtonBackground: rgba(86, 99, 119, 0.11);--vscode-icube-defaultButtonForeground: #31353a;--vscode-icube-defaultButtonHoverBackground: rgba(86, 99, 119, 0.15);--vscode-icube-defaultButtonHoverForeground: #31353a;--vscode-icube-defaultButtonActivateBackground: rgba(86, 99, 119, 0.19);--vscode-icube-defaultButtonActivateForeground: #31353a;--vscode-icube-defaultButtonDisableBackground: rgba(86, 99, 119, 0.15);--vscode-icube-defaultButtonDisableForeground: #8a9096;--vscode-icube-checkboxBorder: #31353a;--vscode-icube-checkboxBackground: #31353a;--vscode-icube-checkboxDisabledBackground: #8a9096;--vscode-icube-checkboxForeground: #ffffff;--vscode-icube-checkboxUncheckedBorder: rgba(77, 107, 153, 0.18);--vscode-icube-checkboxUncheckedBackground: #ffffff;--vscode-icube-badgeBackground: #2f74ff;--vscode-icube-badgeForeground: #ffffff;--vscode-icube-colorBgTr1: rgba(86, 99, 119, 0.11);--vscode-icube-colorBgTr2: rgba(86, 99, 119, 0.15);--vscode-icube-colorBgTr3: rgba(86, 99, 119, 0.19);--vscode-icube-colorTextDefault: #31353a;--vscode-icube-colorTextHighlight: #111214;--vscode-icube-colorTextGray: #5b6066;--vscode-icube-colorTextDisable: #8a9096;--vscode-icube-colorBrandTr1: rgba(86, 99, 119, 0.11);--vscode-icube-colorBrandTr2: rgba(86, 99, 119, 0.15);--vscode-icube-colorBrandTr3: rgba(86, 99, 119, 0.19);--vscode-icube-colorSuccessTr1: rgba(64, 176, 139, 0.12);--vscode-icube-colorSuccessTr2: rgba(64, 176, 139, 0.18);--vscode-icube-colorSuccessTr3: rgba(64, 176, 139, 0.36);--vscode-icube-colorErrorTr2: rgba(232, 70, 58, 0.16);--vscode-icube-colorErrorTr3: rgba(232, 70, 58, 0.36);--vscode-icube-colorWarningTr1: rgba(226, 138, 0, 0.12);--vscode-icube-colorWarningTr2: rgba(226, 138, 0, 0.16);--vscode-icube-colorWarningTr3: rgba(226, 138, 0, 0.36);--vscode-icube-colorAlertTr1: rgba(198, 166, 38, 0.14);--vscode-icube-colorAlertTr2: rgba(198, 166, 38, 0.2);--vscode-icube-colorAlertTr3: rgba(198, 166, 38, 0.36);--vscode-icube-colorTextButtonHighlight: #111214;--vscode-icube--special-white: #ffffff;--vscode-icube--special-black: #000000;--vscode-icube--bg-bg-base-default: #ffffff;--vscode-icube--bg-bg-tooltip: #ffffff;--vscode-icube--bg-bg-base-secondary: #edeff2;--vscode-icube--bg-bg-base-tertiary: #ffffff;--vscode-icube--bg-bg-overlay-l1: rgba(86, 99, 119, 0.07);--vscode-icube--bg-bg-overlay-l2: rgba(86, 99, 119, 0.11);--vscode-icube--bg-bg-overlay-l3: rgba(86, 99, 119, 0.15);--vscode-icube--bg-bg-overlay-l4: rgba(86, 99, 119, 0.19);--vscode-icube--border-border-neutral-l1: rgba(77, 107, 153, 0.09);--vscode-icube--border-border-neutral-l2: rgba(77, 107, 153, 0.18);--vscode-icube--border-border-neutral-l3: rgba(77, 107, 153, 0.36);--vscode-icube--text-text-default-hover: #111214;--vscode-icube--text-text-default-active: #111214;--vscode-icube--icon-icon-default-hover: #111214;--vscode-icube--icon-icon-default-active: #111214;--vscode-icube--text-text-default: #31353a;--vscode-icube--text-text-secondary-hover: #31353a;--vscode-icube--text-text-secondary-active: #31353a;--vscode-icube--icon-icon-default: #31353a;--vscode-icube--icon-icon-secondary-hover: #31353a;--vscode-icube--icon-icon-secondary-active: #31353a;--vscode-icube--text-text-secondary: #5b6066;--vscode-icube--icon-icon-secondary: #5b6066;--vscode-icube--text-text-tertiary: #8a9096;--vscode-icube--text-text-disabled: #8a9096;--vscode-icube--icon-icon-tertiary: #8a9096;--vscode-icube--icon-icon-disabled: #8a9096;--vscode-icube--status-primary-default: #2f74ff;--vscode-icube--status-primary-hover: #4c88ff;--vscode-icube--status-primary-active: #1759dd;--vscode-icube--status-primary-surface-l1: rgba(47, 116, 255, 0.12);--vscode-icube--status-primary-surface-l2: rgba(47, 116, 255, 0.18);--vscode-icube--status-primary-surface-l3: rgba(47, 116, 255, 0.36);--vscode-icube--status-success-default: #26a57b;--vscode-icube--status-success-hover: #2ca77f;--vscode-icube--status-success-active: #1e8b56;--vscode-icube--status-success-surface-l1: rgba(64, 176, 139, 0.12);--vscode-icube--status-success-surface-l2: rgba(64, 176, 139, 0.18);--vscode-icube--status-success-surface-l3: rgba(64, 176, 139, 0.36);--vscode-icube--status-alert-default: #c6a626;--vscode-icube--status-alert-hover: #dfb716;--vscode-icube--status-alert-active: #af8d06;--vscode-icube--status-alert-surface-l1: rgba(198, 166, 38, 0.14);--vscode-icube--status-alert-surface-l2: rgba(198, 166, 38, 0.2);--vscode-icube--status-alert-surface-l3: rgba(198, 166, 38, 0.36);--vscode-icube--status-warning-default: #e28a00;--vscode-icube--status-warning-hover: #f18c13;--vscode-icube--status-warning-active: #c46f11;--vscode-icube--status-warning-surface-l1: rgba(226, 138, 0, 0.12);--vscode-icube--status-warning-surface-l2: rgba(226, 138, 0, 0.16);--vscode-icube--status-warning-surface-l3: rgba(226, 138, 0, 0.36);--vscode-icube--status-error-default: #e8463a;--vscode-icube--status-error-hover: #ea574c;--vscode-icube--status-error-active: #c9382f;--vscode-icube--status-error-surface-l1: rgba(232, 70, 58, 0.12);--vscode-icube--status-error-surface-l2: rgba(232, 70, 58, 0.16);--vscode-icube--status-error-surface-l3: rgba(232, 70, 58, 0.36);--vscode-icube--bg-bg-invert: #36393d;--vscode-icube--bg-bg-invert-hover: #72767b;--vscode-icube--bg-bg-invert-active: #1a1b1d;--vscode-icube--bg-bg-invert-disabled: rgba(86, 99, 119, 0.19);--vscode-icube--accent-accent-teal: #00b983;--vscode-icube--accent-accent-coral: #ff6b45;--vscode-icube--accent-accent-amber: #f2a90c;--vscode-icube--accent-accent-lime: #5fbf00;--vscode-icube--accent-accent-cyan: #00b8f8;--vscode-icube--accent-accent-blue: #3f85ff;--vscode-icube--accent-accent-magenta: #f53cff;--vscode-icube--accent-accent-violet: #9570ff;--vscode-icube--accent-accent-slate: #747e94;--vscode-icube--bg-bg-menu: #f8f9fa;--vscode-icube--bg-bg-menu-tr0: rgba(255, 255, 255, 0);--vscode-icube--bg-bg-brand: #0fdc78;--vscode-icube--bg-bg-brand-hover: #0ab861;--vscode-icube--bg-bg-brand-disabled: rgba(10, 184, 97, 0.2);--vscode-icube--border-border-contrast: #000000;--vscode-icube--border-border-brand: #0fdc78;--vscode-icube--text-text-brand: #0ab861;--vscode-icube--icon-icon-brand: #0ab861;--vscode-icube--text-text-brand-hover: #0fdc78;--vscode-icube--icon-icon-brand-hover: #0fdc78;--vscode-icube--text-text-onbrand: #0c0c0d;--vscode-icube--icon-icon-onbrand: #0c0c0d;--vscode-icube--text-text-onaccent: #ffffff;--vscode-icube--icon-icon-onaccent: #ffffff;--vscode-icube--special-bgtabsoverlay: rgba(193, 195, 205, 0.12);--vscode-icube--code-code-tag: #e24864;--vscode-icube--code-code-instruction: #b15ef2;--vscode-icube--code-code-doc: #8393a3;--vscode-icube--code-code-parameter: #4da621;--vscode-icube--cue: #0ab861;--vscode-icube--cue-tr0: rgba(10, 184, 97, 0);--vscode-icube--cue-tr1: rgba(10, 184, 97, 0.16);--vscode-icube--cue-tr2: rgba(10, 184, 97, 0.32);--vscode-icube--cue-diff-add: #00a56e;--vscode-icube--cue-diff-add-inline: rgba(0, 165, 110, 0.12);--vscode-icube--cue-diff-add-popup: rgba(0, 165, 110, 0.18);--vscode-icube--cue-diff-remove: rgba(232, 70, 58, 0.14);--vscode-icube--cue-diff-line: rgba(0, 0, 0, 0.32);--vscode-solo-lite-root-background: #edeff2;--vscode-icube-memoryRiskBackground: #fef3e2;--vscode-icube-memoryRiskBorder: #e8a838;--vscode-icube-memoryRiskIcon: #c87a1c;--vscode-icube-blendColor.btnHover.bg2: #e0e3e9;--vscode-icube-blendColor.btnTransparent3.bg2: #d3d8df;--vscode-editor-lineHighlightBackground: rgba(114, 118, 123, 0.08);--vscode-editor-inactiveLineHighlightBackground: rgba(114, 118, 123, 0.08);--vscode-editor-lineHighlightBorder: #eeeeee;--vscode-editor-rangeHighlightBackground: rgba(253, 255, 0, 0.2);--vscode-editor-symbolHighlightBackground: rgba(234, 92, 0, 0.33);--vscode-editorCursor-foreground: #000000;--vscode-editorMultiCursor-primary.foreground: #000000;--vscode-editorMultiCursor-secondary.foreground: #000000;--vscode-editorWhitespace-foreground: rgba(51, 51, 51, 0.2);--vscode-editorLineNumber-foreground: #72767b;--vscode-editorIndentGuide-background: rgba(77, 107, 153, 0.09);--vscode-editorIndentGuide-activeBackground: rgba(77, 107, 153, 0.36);--vscode-editorIndentGuide-background1: rgba(77, 107, 153, 0.09);--vscode-editorIndentGuide-background2: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-background3: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-background4: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-background5: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-background6: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-activeBackground1: rgba(77, 107, 153, 0.36);--vscode-editorIndentGuide-activeBackground2: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-activeBackground3: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-activeBackground4: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-activeBackground5: rgba(0, 0, 0, 0);--vscode-editorIndentGuide-activeBackground6: rgba(0, 0, 0, 0);--vscode-editorActiveLineNumber-foreground: #0b216f;--vscode-editorLineNumber-activeForeground: #111214;--vscode-editorRuler-foreground: #d3d3d3;--vscode-editorCodeLens-foreground: #919191;--vscode-editorBracketMatch-background: rgba(114, 118, 123, 0.24);--vscode-editorBracketMatch-border: #b9b9b9;--vscode-editorOverviewRuler-border: rgba(127, 127, 127, 0.3);--vscode-editorGutter-background: #ffffff;--vscode-editorUnnecessaryCode-opacity: rgba(0, 0, 0, 0.5);--vscode-editorGhostText-foreground: rgba(0, 0, 0, 0.47);--vscode-editorOverviewRuler-rangeHighlightForeground: rgba(0, 122, 204, 0.6);--vscode-editorOverviewRuler-errorForeground: rgba(255, 18, 18, 0.7);--vscode-editorOverviewRuler-warningForeground: #bf8803;--vscode-editorOverviewRuler-infoForeground: #0063d3;--vscode-editorBracketHighlight-foreground1: #0431fa;--vscode-editorBracketHighlight-foreground2: #319331;--vscode-editorBracketHighlight-foreground3: #7b3814;--vscode-editorBracketHighlight-foreground4: rgba(0, 0, 0, 0);--vscode-editorBracketHighlight-foreground5: rgba(0, 0, 0, 0);--vscode-editorBracketHighlight-foreground6: rgba(0, 0, 0, 0);--vscode-editorBracketHighlight-unexpectedBracket.foreground: rgba(255, 18, 18, 0.8);--vscode-editorBracketPairGuide-background1: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-background2: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-background3: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-background4: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-background5: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-background6: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground1: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground2: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground3: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground4: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground5: rgba(0, 0, 0, 0);--vscode-editorBracketPairGuide-activeBackground6: rgba(0, 0, 0, 0);--vscode-editorUnicodeHighlight-border: #bf8803;--vscode-diffEditor-move.border: rgba(139, 139, 139, 0.61);--vscode-diffEditor-moveActive.border: #ffa500;--vscode-diffEditor-unchangedRegionShadow: rgba(115, 115, 115, 0.75);--vscode-settings-headerForeground: #111214;--vscode-settings-settingsHeaderHoverForeground: rgba(17, 18, 20, 0.7);--vscode-settings-modifiedItemIndicator: #36393d;--vscode-settings-headerBorder: rgba(77, 107, 153, 0.18);--vscode-settings-sashBorder: rgba(128, 128, 128, 0.35);--vscode-settings-dropdownBackground: #ffffff;--vscode-settings-dropdownForeground: #31353a;--vscode-settings-dropdownBorder: rgba(77, 107, 153, 0.09);--vscode-settings-dropdownListBorder: #c8c8c8;--vscode-settings-checkboxBackground: #ffffff;--vscode-settings-checkboxForeground: #31353a;--vscode-settings-checkboxBorder: #919191;--vscode-settings-textInputBackground: rgba(86, 99, 119, 0.07);--vscode-settings-textInputForeground: #31353a;--vscode-settings-textInputBorder: #cecece;--vscode-settings-numberInputBackground: rgba(86, 99, 119, 0.07);--vscode-settings-numberInputForeground: #31353a;--vscode-settings-numberInputBorder: #cecece;--vscode-settings-focusedRowBackground: rgba(86, 99, 119, 0.07);--vscode-settings-rowHoverBackground: rgba(86, 99, 119, 0.03);--vscode-settings-focusedRowBorder: rgba(0, 0, 0, 0);--vscode-editorOverviewRuler-bracketMatchForeground: #a0a0a0;--vscode-actionBar-toggledBackground: #dddddd;--vscode-symbolIcon-arrayForeground: #31353a;--vscode-symbolIcon-booleanForeground: #31353a;--vscode-symbolIcon-classForeground: #d67e00;--vscode-symbolIcon-colorForeground: #31353a;--vscode-symbolIcon-constantForeground: #31353a;--vscode-symbolIcon-constructorForeground: #652d90;--vscode-symbolIcon-enumeratorForeground: #d67e00;--vscode-symbolIcon-enumeratorMemberForeground: #007acc;--vscode-symbolIcon-eventForeground: #d67e00;--vscode-symbolIcon-fieldForeground: #007acc;--vscode-symbolIcon-fileForeground: #31353a;--vscode-symbolIcon-folderForeground: #31353a;--vscode-symbolIcon-functionForeground: #652d90;--vscode-symbolIcon-interfaceForeground: #007acc;--vscode-symbolIcon-keyForeground: #31353a;--vscode-symbolIcon-keywordForeground: #31353a;--vscode-symbolIcon-methodForeground: #b180d7;--vscode-symbolIcon-moduleForeground: #31353a;--vscode-symbolIcon-namespaceForeground: #31353a;--vscode-symbolIcon-nullForeground: #31353a;--vscode-symbolIcon-numberForeground: #31353a;--vscode-symbolIcon-objectForeground: #31353a;--vscode-symbolIcon-operatorForeground: #31353a;--vscode-symbolIcon-packageForeground: #31353a;--vscode-symbolIcon-propertyForeground: #31353a;--vscode-symbolIcon-referenceForeground: #31353a;--vscode-symbolIcon-snippetForeground: #31353a;--vscode-symbolIcon-stringForeground: #31353a;--vscode-symbolIcon-structForeground: #31353a;--vscode-symbolIcon-textForeground: #31353a;--vscode-symbolIcon-typeParameterForeground: #31353a;--vscode-symbolIcon-unitForeground: #31353a;--vscode-symbolIcon-variableForeground: #007acc;--vscode-peekViewTitle-background: #f3f3f3;--vscode-peekViewTitleLabel-foreground: #000000;--vscode-peekViewTitleDescription-foreground: #616161;--vscode-peekView-border: #0063d3;--vscode-peekViewResult-background: #f3f3f3;--vscode-peekViewResult-lineForeground: #646465;--vscode-peekViewResult-fileForeground: #1e1e1e;--vscode-peekViewResult-selectionBackground: rgba(51, 153, 255, 0.2);--vscode-peekViewResult-selectionForeground: #6c6c6c;--vscode-peekViewEditor-background: #f2f8fc;--vscode-peekViewEditorGutter-background: #f2f8fc;--vscode-peekViewEditorStickyScroll-background: #f2f8fc;--vscode-peekViewEditorStickyScrollGutter-background: #f2f8fc;--vscode-peekViewResult-matchHighlightBackground: rgba(234, 92, 0, 0.3);--vscode-peekViewEditor-matchHighlightBackground: rgba(245, 216, 2, 0.87);--vscode-editorMarkerNavigationError-background: #e51400;--vscode-editorMarkerNavigationError-headerBackground: rgba(229, 20, 0, 0.1);--vscode-editorMarkerNavigationWarning-background: #bf8803;--vscode-editorMarkerNavigationWarning-headerBackground: rgba(191, 136, 3, 0.1);--vscode-editorMarkerNavigationInfo-background: #0063d3;--vscode-editorMarkerNavigationInfo-headerBackground: rgba(0, 99, 211, 0.1);--vscode-editorMarkerNavigation-background: #ffffff;--vscode-editor-foldBackground: rgba(47, 116, 255, 0.05);--vscode-editor-foldPlaceholderForeground: #808080;--vscode-editorGutter-foldingControlForeground: #5b6066;--vscode-editorSuggestWidget-background: #f3f3f3;--vscode-editorSuggestWidget-border: #c8c8c8;--vscode-editorSuggestWidget-foreground: #31353a;--vscode-editorSuggestWidget-selectedForeground: #111214;--vscode-editorSuggestWidget-selectedIconForeground: #5b6066;--vscode-editorSuggestWidget-selectedBackground: rgba(86, 99, 119, 0.11);--vscode-editorSuggestWidget-highlightForeground: #0066bf;--vscode-editorSuggestWidget-focusHighlightForeground: #0066bf;--vscode-editorSuggestWidgetStatus-foreground: rgba(49, 53, 58, 0.5);--vscode-inlineEdit-originalBackground: rgba(232, 70, 58, 0.03);--vscode-inlineEdit-modifiedBackground: rgba(64, 176, 139, 0.05);--vscode-inlineEdit-originalChangedLineBackground: rgba(232, 70, 58, 0.13);--vscode-inlineEdit-originalChangedTextBackground: rgba(232, 70, 58, 0.13);--vscode-inlineEdit-modifiedChangedLineBackground: rgba(64, 176, 139, 0.09);--vscode-inlineEdit-modifiedChangedTextBackground: rgba(64, 176, 139, 0.13);--vscode-inlineEdit-gutterIndicator.primaryForeground: #ffffff;--vscode-inlineEdit-gutterIndicator.primaryBorder: #31353a;--vscode-inlineEdit-gutterIndicator.primaryBackground: rgba(49, 53, 58, 0.5);--vscode-inlineEdit-gutterIndicator.secondaryForeground: #ffffff;--vscode-inlineEdit-gutterIndicator.secondaryBorder: #5f6a79;--vscode-inlineEdit-gutterIndicator.secondaryBackground: #5f6a79;--vscode-inlineEdit-gutterIndicator.successfulForeground: #ffffff;--vscode-inlineEdit-gutterIndicator.successfulBorder: #31353a;--vscode-inlineEdit-gutterIndicator.successfulBackground: #31353a;--vscode-inlineEdit-gutterIndicator.background: rgba(95, 95, 95, 0.09);--vscode-inlineEdit-originalBorder: rgba(232, 70, 58, 0.16);--vscode-inlineEdit-modifiedBorder: rgba(26, 70, 55, 0.18);--vscode-inlineEdit-tabWillAcceptModifiedBorder: rgba(26, 70, 55, 0.18);--vscode-inlineEdit-tabWillAcceptOriginalBorder: rgba(232, 70, 58, 0.16);--vscode-editor-linkedEditingBackground: rgba(255, 0, 0, 0.3);--vscode-editor-wordHighlightBackground: rgba(114, 118, 123, 0.24);--vscode-editor-wordHighlightStrongBackground: rgba(14, 99, 156, 0.25);--vscode-editor-wordHighlightTextBackground: rgba(114, 118, 123, 0.24);--vscode-editorOverviewRuler-wordHighlightForeground: rgba(160, 160, 160, 0.8);--vscode-editorOverviewRuler-wordHighlightStrongForeground: rgba(192, 160, 192, 0.8);--vscode-editorOverviewRuler-wordHighlightTextForeground: rgba(160, 160, 160, 0.8);--vscode-editorHoverWidget-highlightForeground: #0066bf;--vscode-editor-placeholder.foreground: rgba(0, 0, 0, 0.47);--vscode-editorGutter-modifiedBackground: #2090d3;--vscode-editorGutter-modifiedSecondaryBackground: #aad8f2;--vscode-editorGutter-addedBackground: #48985d;--vscode-editorGutter-addedSecondaryBackground: #a7d5b3;--vscode-editorGutter-deletedBackground: #e51400;--vscode-editorGutter-deletedSecondaryBackground: #ff3d2b;--vscode-minimapGutter-modifiedBackground: #2090d3;--vscode-minimapGutter-addedBackground: #48985d;--vscode-minimapGutter-deletedBackground: #e51400;--vscode-editorOverviewRuler-modifiedForeground: rgba(32, 144, 211, 0.6);--vscode-editorOverviewRuler-addedForeground: rgba(72, 152, 93, 0.6);--vscode-editorOverviewRuler-deletedForeground: rgba(229, 20, 0, 0.6);--vscode-editorGutter-itemGlyphForeground: #31353a;--vscode-editorGutter-itemBackground: #dee0e5;--vscode-agentSessionReadIndicator-foreground: rgba(49, 53, 58, 0.15);--vscode-terminal-foreground: #333333;--vscode-terminal-selectionBackground: rgba(47, 116, 255, 0.18);--vscode-terminal-inactiveSelectionBackground: #e5ebf1;--vscode-terminalCommandDecoration-defaultBackground: rgba(0, 0, 0, 0.25);--vscode-terminalCommandDecoration-successBackground: #2090d3;--vscode-terminalCommandDecoration-errorBackground: #e51400;--vscode-terminalOverviewRuler-cursorForeground: rgba(160, 160, 160, 0.8);--vscode-terminal-border: rgba(128, 128, 128, 0.35);--vscode-terminalOverviewRuler-border: rgba(127, 127, 127, 0.3);--vscode-terminal-findMatchBackground: #a8ac94;--vscode-terminal-hoverHighlightBackground: rgba(173, 214, 255, 0.07);--vscode-terminal-findMatchHighlightBackground: rgba(234, 92, 0, 0.33);--vscode-terminalOverviewRuler-findMatchForeground: rgba(209, 134, 22, 0.49);--vscode-terminal-dropBackground: rgba(33, 97, 224, 0.16);--vscode-terminal-tab.activeBorder: #ffffff;--vscode-terminal-initialHintForeground: rgba(0, 0, 0, 0.47);--vscode-scmGraph-historyItemRefColor: #0063d3;--vscode-scmGraph-historyItemRemoteRefColor: #652d90;--vscode-scmGraph-historyItemBaseRefColor: #ea5c00;--vscode-scmGraph-historyItemHoverDefaultLabelForeground: #31353a;--vscode-scmGraph-historyItemHoverDefaultLabelBackground: #c4c4c4;--vscode-scmGraph-historyItemHoverLabelForeground: #ffffff;--vscode-scmGraph-historyItemHoverAdditionsForeground: #587c0c;--vscode-scmGraph-historyItemHoverDeletionsForeground: #ad0707;--vscode-scmGraph-foreground1: #ffb000;--vscode-scmGraph-foreground2: #dc267f;--vscode-scmGraph-foreground3: #994f00;--vscode-scmGraph-foreground4: #40b0a6;--vscode-scmGraph-foreground5: #b66dff;--vscode-commentsView-resolvedIcon: #8a9096;--vscode-commentsView-unresolvedIcon: rgba(0, 0, 0, 0);--vscode-editorCommentsWidget-replyInputBackground: #f3f3f3;--vscode-editorCommentsWidget-resolvedBorder: #8a9096;--vscode-editorCommentsWidget-unresolvedBorder: rgba(0, 0, 0, 0);--vscode-editorCommentsWidget-rangeBackground: rgba(0, 0, 0, 0);--vscode-editorCommentsWidget-rangeActiveBackground: rgba(0, 0, 0, 0);--vscode-editorGutter-commentRangeForeground: #dee0e5;--vscode-editorOverviewRuler-commentForeground: #dee0e5;--vscode-editorOverviewRuler-commentUnresolvedForeground: #dee0e5;--vscode-editorOverviewRuler-commentDraftForeground: #dee0e5;--vscode-editorGutter-commentGlyphForeground: #31353a;--vscode-editorGutter-commentUnresolvedGlyphForeground: #31353a;--vscode-editorGutter-commentDraftGlyphForeground: #31353a;--vscode-ports-iconRunningProcessForeground: #369432;--vscode-welcomePage-tileBackground: #f3f3f3;--vscode-welcomePage-tileHoverBackground: #dbdbdb;--vscode-welcomePage-tileBorder: rgba(0, 0, 0, 0.1);--vscode-welcomePage-progress.background: rgba(86, 99, 119, 0.07);--vscode-welcomePage-progress.foreground: #006ab1;--vscode-walkthrough-stepTitle.foreground: #000000;--vscode-extensionIcon-verifiedForeground: #006ab1;--vscode-keybindingTable-headerBackground: rgba(49, 53, 58, 0.04);--vscode-keybindingTable-rowsBackground: rgba(49, 53, 58, 0.04);--vscode-extensionButton-background: #31353a;--vscode-extensionButton-foreground: #ffffff;--vscode-extensionButton-hoverBackground: #72767b;--vscode-extensionButton-separator: rgba(193, 195, 205, 0.12);--vscode-extensionButton-prominentBackground: #31353a;--vscode-extensionButton-prominentForeground: #ffffff;--vscode-extensionButton-prominentHoverBackground: #72767b;--vscode-debugToolBar-background: #edeff2;--vscode-debugIcon-startForeground: #388a34;--vscode-notebook-cellBorderColor: #e8e8e8;--vscode-notebook-focusedEditorBorder: rgba(0, 0, 0, 0);--vscode-notebookStatusSuccessIcon-foreground: #388a34;--vscode-notebookEditorOverviewRuler-runningCellForeground: #388a34;--vscode-notebookStatusErrorIcon-foreground: #cc4b53;--vscode-notebookStatusRunningIcon-foreground: #31353a;--vscode-notebook-cellToolbarSeparator: rgba(128, 128, 128, 0.35);--vscode-notebook-selectedCellBackground: rgba(200, 221, 241, 0.31);--vscode-notebook-selectedCellBorder: #e8e8e8;--vscode-notebook-focusedCellBorder: rgba(0, 0, 0, 0);--vscode-notebook-inactiveFocusedCellBorder: #e8e8e8;--vscode-notebook-cellStatusBarItemHoverBackground: rgba(0, 0, 0, 0.08);--vscode-notebook-cellInsertionIndicator: rgba(0, 0, 0, 0);--vscode-notebookScrollbarSlider-background: rgba(100, 100, 100, 0.4);--vscode-notebookScrollbarSlider-hoverBackground: rgba(100, 100, 100, 0.7);--vscode-notebookScrollbarSlider-activeBackground: rgba(0, 0, 0, 0.6);--vscode-notebook-symbolHighlightBackground: rgba(253, 255, 0, 0.2);--vscode-notebook-cellEditorBackground: #ffffff;--vscode-notebook-editorBackground: #ffffff;--vscode-inlineChat-foreground: #31353a;--vscode-inlineChat-background: #f3f3f3;--vscode-inlineChat-border: #c8c8c8;--vscode-inlineChat-shadow: rgba(0, 0, 0, 0.08);--vscode-inlineChatInput-border: #c8c8c8;--vscode-inlineChatInput-focusBorder: rgba(0, 0, 0, 0);--vscode-inlineChatInput-placeholderForeground: #5b6066;--vscode-inlineChatInput-background: rgba(86, 99, 119, 0.07);--vscode-inlineChatDiff-inserted: rgba(64, 176, 139, 0.09);--vscode-editorOverviewRuler-inlineChatInserted: rgba(64, 176, 139, 0.14);--vscode-editorMinimap-inlineChatInserted: rgba(64, 176, 139, 0.14);--vscode-inlineChatDiff-removed: rgba(232, 70, 58, 0.08);--vscode-editorOverviewRuler-inlineChatRemoved: rgba(232, 70, 58, 0.13);--vscode-chat-requestBorder: rgba(0, 0, 0, 0.1);--vscode-chat-requestBackground: rgba(255, 255, 255, 0.62);--vscode-chat-slashCommandBackground: rgba(173, 206, 255, 0.48);--vscode-chat-slashCommandForeground: #26569e;--vscode-chat-avatarBackground: #f2f2f2;--vscode-chat-avatarForeground: #31353a;--vscode-chat-editedFileForeground: #895503;--vscode-chat-requestCodeBorder: rgba(14, 99, 156, 0.25);--vscode-chat-requestBubbleBackground: rgba(47, 116, 255, 0.05);--vscode-chat-requestBubbleHoverBackground: rgba(47, 116, 255, 0.11);--vscode-chat-checkpointSeparator: #a9a9a9;--vscode-chat-linesAddedForeground: #107c10;--vscode-chat-linesRemovedForeground: #bc2f32;--vscode-extensionIcon-starForeground: #df6100;--vscode-extensionIcon-preReleaseForeground: #1d9271;--vscode-extensionIcon-sponsorForeground: #b51e78;--vscode-extensionIcon-privateForeground: rgba(0, 0, 0, 0.38);--vscode-debugExceptionWidget-border: #a31515;--vscode-debugExceptionWidget-background: #f1dfde;--vscode-editor-inlineValuesForeground: rgba(0, 0, 0, 0.5);--vscode-editor-inlineValuesBackground: rgba(255, 200, 0, 0.2);--vscode-debugIcon-breakpointForeground: #cc4b53;--vscode-debugIcon-breakpointDisabledForeground: #848484;--vscode-debugIcon-breakpointUnverifiedForeground: #848484;--vscode-debugIcon-breakpointCurrentStackframeForeground: #be8700;--vscode-debugIcon-breakpointStackframeForeground: #89d185;--vscode-editor-stackFrameHighlightBackground: rgba(255, 255, 102, 0.45);--vscode-editor-focusedStackFrameHighlightBackground: rgba(206, 231, 206, 0.45);--vscode-multiDiffEditor-headerBackground: #f8f8f9;--vscode-multiDiffEditor-background: #ffffff;--vscode-multiDiffEditor-border: #cccccc;--vscode-minimap-chatEditHighlight: rgba(255, 255, 255, 0.6);--vscode-chatManagement-sashBorder: rgba(128, 128, 128, 0.35);--vscode-gauge-foreground: #007acc;--vscode-gauge-background: rgba(0, 122, 204, 0.3);--vscode-gauge-warningForeground: #b89500;--vscode-gauge-warningBackground: rgba(184, 149, 0, 0.3);--vscode-gauge-errorForeground: #e8463a;--vscode-gauge-errorBackground: rgba(232, 70, 58, 0.3);--vscode-interactive-activeCodeBorder: #007acc;--vscode-interactive-inactiveCodeBorder: rgba(86, 99, 119, 0.11);--vscode-testing-iconFailed: #f14c4c;--vscode-testing-iconErrored: #f14c4c;--vscode-testing-iconPassed: #73c991;--vscode-testing-runAction: #73c991;--vscode-testing-iconQueued: #cca700;--vscode-testing-iconUnset: #848484;--vscode-testing-iconSkipped: #848484;--vscode-testing-peekBorder: #e51400;--vscode-testing-messagePeekBorder: #0063d3;--vscode-testing-peekHeaderBackground: rgba(229, 20, 0, 0.1);--vscode-testing-messagePeekHeaderBackground: rgba(0, 99, 211, 0.1);--vscode-testing-coveredBackground: rgba(64, 176, 139, 0.18);--vscode-testing-coveredBorder: rgba(64, 176, 139, 0.14);--vscode-testing-coveredGutterBackground: rgba(64, 176, 139, 0.11);--vscode-testing-uncoveredBranchBackground: #f7c3bf;--vscode-testing-uncoveredBackground: rgba(232, 70, 58, 0.16);--vscode-testing-uncoveredBorder: rgba(232, 70, 58, 0.12);--vscode-testing-uncoveredGutterBackground: rgba(232, 70, 58, 0.24);--vscode-testing-coverCountBadgeBackground: #c4c4c4;--vscode-testing-coverCountBadgeForeground: #333333;--vscode-testing-message.error.badgeBackground: #e51400;--vscode-testing-message.error.badgeBorder: #e51400;--vscode-testing-message.error.badgeForeground: #ffffff;--vscode-testing-message.info.decorationForeground: rgba(49, 53, 58, 0.5);--vscode-testing-iconErrored.retired: rgba(241, 76, 76, 0.7);--vscode-testing-iconFailed.retired: rgba(241, 76, 76, 0.7);--vscode-testing-iconPassed.retired: rgba(115, 201, 145, 0.7);--vscode-testing-iconQueued.retired: rgba(204, 167, 0, 0.7);--vscode-testing-iconUnset.retired: rgba(132, 132, 132, 0.7);--vscode-testing-iconSkipped.retired: rgba(132, 132, 132, 0.7);--vscode-searchEditor-textInputBorder: #cecece;--vscode-statusBar-debuggingBackground: #cc6633;--vscode-statusBar-debuggingForeground: #ffffff;--vscode-commandCenter-debuggingBackground: rgba(204, 102, 51, 0.26);--vscode-debugTokenExpression-name: #9b46b0;--vscode-debugTokenExpression-type: #4a90e2;--vscode-debugTokenExpression-value: rgba(108, 108, 108, 0.8);--vscode-debugTokenExpression-string: #a31515;--vscode-debugTokenExpression-boolean: #0000ff;--vscode-debugTokenExpression-number: #098658;--vscode-debugTokenExpression-error: #e51400;--vscode-debugView-exceptionLabelForeground: #ffffff;--vscode-debugView-exceptionLabelBackground: #a31515;--vscode-debugView-stateLabelForeground: #31353a;--vscode-debugView-stateLabelBackground: rgba(136, 136, 136, 0.27);--vscode-debugView-valueChangedHighlight: #569cd6;--vscode-debugConsole-infoForeground: #0063d3;--vscode-debugConsole-warningForeground: #bf8803;--vscode-debugConsole-errorForeground: #cc4b53;--vscode-debugConsole-sourceForeground: #31353a;--vscode-debugConsoleInputIcon-foreground: #31353a;--vscode-debugIcon-pauseForeground: #007acc;--vscode-debugIcon-stopForeground: #a1260d;--vscode-debugIcon-disconnectForeground: #a1260d;--vscode-debugIcon-restartForeground: #388a34;--vscode-debugIcon-stepOverForeground: #007acc;--vscode-debugIcon-stepIntoForeground: #007acc;--vscode-debugIcon-stepOutForeground: #007acc;--vscode-debugIcon-continueForeground: #007acc;--vscode-debugIcon-stepBackForeground: #007acc;--vscode-mergeEditor-change.background: rgba(155, 185, 85, 0.2);--vscode-mergeEditor-change.word.background: rgba(156, 204, 44, 0.4);--vscode-mergeEditor-changeBase.background: #ffcccc;--vscode-mergeEditor-changeBase.word.background: #ffa3a3;--vscode-mergeEditor-conflict.unhandledUnfocused.border: #ffa600;--vscode-mergeEditor-conflict.unhandledFocused.border: #ffa600;--vscode-mergeEditor-conflict.handledUnfocused.border: rgba(134, 134, 134, 0.29);--vscode-mergeEditor-conflict.handledFocused.border: rgba(193, 193, 193, 0.8);--vscode-mergeEditor-conflict.handled.minimapOverViewRuler: rgba(173, 172, 168, 0.93);--vscode-mergeEditor-conflict.unhandled.minimapOverViewRuler: #fcba03;--vscode-mergeEditor-conflictingLines.background: rgba(255, 234, 0, 0.28);--vscode-mergeEditor-conflict.input1.background: rgba(64, 200, 174, 0.2);--vscode-mergeEditor-conflict.input2.background: rgba(64, 166, 255, 0.2);--vscode-terminal-ansiBlack: #000000;--vscode-terminal-ansiRed: #cd3131;--vscode-terminal-ansiGreen: #107c10;--vscode-terminal-ansiYellow: #949800;--vscode-terminal-ansiBlue: #0451a5;--vscode-terminal-ansiMagenta: #bc05bc;--vscode-terminal-ansiCyan: #0598bc;--vscode-terminal-ansiWhite: #555555;--vscode-terminal-ansiBrightBlack: #666666;--vscode-terminal-ansiBrightRed: #cd3131;--vscode-terminal-ansiBrightGreen: #14ce14;--vscode-terminal-ansiBrightYellow: #b5ba00;--vscode-terminal-ansiBrightBlue: #0451a5;--vscode-terminal-ansiBrightMagenta: #bc05bc;--vscode-terminal-ansiBrightCyan: #0598bc;--vscode-terminal-ansiBrightWhite: #a5a5a5;--vscode-simpleFindWidget-sashBorder: #c8c8c8;--vscode-terminalStickyScrollHover-background: #f0f0f0;--vscode-terminalCommandGuide-foreground: rgba(86, 99, 119, 0.11);--vscode-terminalSymbolIcon-flagForeground: #d67e00;--vscode-terminalSymbolIcon-aliasForeground: #b180d7;--vscode-terminalSymbolIcon-optionValueForeground: #007acc;--vscode-terminalSymbolIcon-methodForeground: #b180d7;--vscode-terminalSymbolIcon-argumentForeground: #007acc;--vscode-terminalSymbolIcon-optionForeground: #d67e00;--vscode-terminalSymbolIcon-fileForeground: #31353a;--vscode-terminalSymbolIcon-folderForeground: #31353a;--vscode-terminalSymbolIcon-commitForeground: #31353a;--vscode-terminalSymbolIcon-branchForeground: #31353a;--vscode-terminalSymbolIcon-tagForeground: #31353a;--vscode-terminalSymbolIcon-stashForeground: #31353a;--vscode-terminalSymbolIcon-remoteForeground: #31353a;--vscode-terminalSymbolIcon-pullRequestForeground: #31353a;--vscode-terminalSymbolIcon-pullRequestDoneForeground: #31353a;--vscode-terminalSymbolIcon-symbolicLinkFileForeground: #31353a;--vscode-terminalSymbolIcon-symbolicLinkFolderForeground: #31353a;--vscode-terminalSymbolIcon-symbolText: #31353a;--vscode-markdownAlert-note.foreground: #0063d3;--vscode-markdownAlert-tip.foreground: #388a34;--vscode-markdownAlert-important.foreground: #652d90;--vscode-markdownAlert-warning.foreground: #bf8803;--vscode-markdownAlert-caution.foreground: #e51400;--vscode-walkThrough-embeddedEditorBackground: #f4f4f4;--vscode-profiles-sashBorder: rgba(128, 128, 128, 0.35);--vscode-icube-inlineChat.regionHighlight: rgba(225, 225, 225, 0.2);--vscode-icube-inlineChatDiff.inserted: rgba(64, 176, 139, 0.09);--vscode-icube-inlineChatDiff.removed: rgba(232, 70, 58, 0.08);--vscode-icube-simpleInlineChat.regionHighlight: rgba(225, 225, 225, 0.2);--vscode-icube-simpleInlineChatDiff.inserted: rgba(64, 176, 139, 0.12);--vscode-icube-simpleInlineChatDiff.removed: rgba(232, 70, 58, 0.12);--vscode-gitDecoration-addedResourceForeground: #587c0c;--vscode-gitDecoration-modifiedResourceForeground: #f0a50f;--vscode-gitDecoration-deletedResourceForeground: #ad0707;--vscode-gitDecoration-renamedResourceForeground: #00aa62;--vscode-gitDecoration-untrackedResourceForeground: #00aa62;--vscode-gitDecoration-ignoredResourceForeground: #8e8e90;--vscode-gitDecoration-stageModifiedResourceForeground: #f0a50f;--vscode-gitDecoration-stageDeletedResourceForeground: #ad0707;--vscode-gitDecoration-conflictingResourceForeground: #ad0707;--vscode-gitDecoration-submoduleResourceForeground: #1258a7;--vscode-git-blame.editorDecorationForeground: #969696;}</style><style id="solo-lite-theme-variables">:root {
|
||
--workspace-gap-width: 4px;
|
||
--header-height: 48px;
|
||
|
||
--radius-sm: 4px;
|
||
--radius-md: 8px;
|
||
--radius-lg: 12px;
|
||
--radius-xl: 20px;
|
||
--radius-full: 9999px;
|
||
--radius-2: 2px;
|
||
--radius-4: 4px;
|
||
--radius-6: 6px;
|
||
--radius-8: 8px;
|
||
--radius-12: 12px;
|
||
--radius-16: 16px;
|
||
--radius-20: 20px;
|
||
--radius-24: 24px;
|
||
--radius-32: 32px;
|
||
--radius-radius-2xs-4: 4px;
|
||
--radius-radius-xs-6: 6px;
|
||
--radius-radius-sm-8: 8px;
|
||
--radius-radius-md-12: 12px;
|
||
--radius-radius-lg-16: 16px;
|
||
--radius-radius-xl-20: 20px;
|
||
--radius-radius-2xl-24: 24px;
|
||
--radius-radius-3xl-32: 32px;
|
||
--radius-radius-full: 9999px;
|
||
|
||
--spacing-xs: 4px;
|
||
--spacing-sm: 8px;
|
||
--spacing-md: 12px;
|
||
--spacing-lg: 16px;
|
||
--spacing-xl: 24px;
|
||
--spacing-xxl: 32px;
|
||
|
||
--spacer-0: 0px;
|
||
--spacer-2: 2px;
|
||
--spacer-4: 4px;
|
||
--spacer-6: 6px;
|
||
--spacer-8: 8px;
|
||
--spacer-12: 12px;
|
||
--spacer-16: 16px;
|
||
--spacer-20: 20px;
|
||
--spacer-24: 24px;
|
||
--spacer-32: 32px;
|
||
--spacer-40: 40px;
|
||
--spacer-48: 48px;
|
||
--spacer-64: 64px;
|
||
|
||
--font-size-xs: 10px;
|
||
--font-size-sm: 11px;
|
||
--font-size-md: 12px;
|
||
--font-size-regular: 13px;
|
||
--font-size-base: 14px;
|
||
--font-size-lg: 16px;
|
||
--font-size-xl: 20px;
|
||
--font-size-xxl: 24px;
|
||
|
||
--font-family-default:
|
||
'SF Pro Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, 'PingFang SC', 'Microsoft YaHei',
|
||
'Hiragino Sans GB', Roboto, sans-serif;
|
||
--font-family-heading:
|
||
'SF Pro Text', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, 'PingFang SC', 'Microsoft YaHei',
|
||
'Hiragino Sans GB', Roboto, sans-serif;
|
||
--font-family-mono: 'JetBrains Mono', 'SF Mono', Monaco, Consolas, monospace;
|
||
--font-weight-default: 400;
|
||
--font-weight-code: 450;
|
||
--font-weight-medium: 500;
|
||
--font-weight-strong: 600;
|
||
|
||
--chat-body-md: 13px/20px var(--font-family-default);
|
||
--chat-body-md-strong: 500 13px/20px var(--font-family-default);
|
||
--chat-body-base: 14px/22px var(--font-family-default);
|
||
--chat-body-base-strong: 500 14px/22px var(--font-family-default);
|
||
--chat-spacer-2xs: 2px;
|
||
--chat-spacer-xs: 4px;
|
||
--chat-spacer-sm: 8px;
|
||
--chat-spacer-md: 12px;
|
||
--chat-spacer-lg: 16px;
|
||
--chat-spacer-xl: 20px;
|
||
--chat-radius-xs: 4px;
|
||
--chat-radius-sm: 8px;
|
||
--chat-radius-md: 12px;
|
||
--chat-radius-lg: 16px;
|
||
--chat-list-item-height: 28px;
|
||
|
||
--transition-fast: 0.15s ease;
|
||
--transition-normal: 0.2s ease;
|
||
--transition-slow: 0.3s ease;
|
||
|
||
/* ===== Z-Index Layer System ===== */
|
||
--z-base: 0;
|
||
--z-above: 1;
|
||
--z-above-2: 2;
|
||
|
||
--z-sticky: 10;
|
||
--z-local-overlay: 100;
|
||
|
||
--z-dropdown: 1000;
|
||
--z-popover: 1010;
|
||
|
||
--z-modal-backdrop: 1090;
|
||
--z-modal: 1100;
|
||
--z-drawer: 1120;
|
||
--z-confirm: 1150;
|
||
|
||
--z-notification: 1200;
|
||
--z-tooltip: 1300;
|
||
|
||
--z-fullscreen: 1400;
|
||
|
||
/* 仅限基础设施 / 调试工具,业务组件禁止直接使用 */
|
||
--z-max: 9999;
|
||
}
|
||
|
||
[data-theme='light'], .vs.solo-lite {
|
||
--shadow-elevation-50: 0 1px 2px -1px rgba(24, 24, 24, 0.08);
|
||
--shadow-elevation-100: 0 3px 9px 0 rgba(24, 24, 24, 0.06);
|
||
--shadow-elevation-100-float: 0 -3px 9px 0 rgba(24, 24, 24, 0.06);
|
||
--shadow-elevation-200: 0 6px 24px -1px rgba(24, 24, 24, 0.06);
|
||
--shadow-elevation-200-reverse: 0 -6px 24px -1px rgba(24, 24, 24, 0.06);
|
||
--shadow-elevation-300: 0 2px 8px -1px rgba(24, 24, 24, 0.02), 0 10px 24px -1px rgba(24, 24, 24, 0.06);
|
||
|
||
--shadow-elevation-100-tooltip: var(--shadow-elevation-100);
|
||
--shadow-elevation-200-menu-panel: var(--shadow-elevation-200);
|
||
--shadow-elevation-300-modal-panel: var(--shadow-elevation-300);
|
||
|
||
/* 输入框阴影颜色 */
|
||
--shadow-chat-input: 0 3px 8px 0 rgba(24, 24, 24, 0.04), 0 6px 24px -1px rgba(24, 24, 24, 0.06);
|
||
--shadow-chat-input-focused: 0 4px 12px 0 rgba(24, 24, 24, 0.04), 0 6px 32px -1px rgba(24, 24, 24, 0.06);
|
||
|
||
--bg-bg-base-default: #ffffff;
|
||
--bg-bg-base-secondary: #f5f5f5;
|
||
--bg-bg-base-tertiary: #e5e5e5;
|
||
--bg-bg-menu: #ffffff;
|
||
--bg-bg-tooltip: #fafafa;
|
||
--bg-bg-input: #ffffff;
|
||
--bg-bg-overlay-l1: rgba(115, 115, 115, 0.08);
|
||
--bg-bg-overlay-l2: rgba(115, 115, 115, 0.12);
|
||
--bg-bg-overlay-l3: rgba(115, 115, 115, 0.16);
|
||
--bg-bg-overlay-l4: rgba(115, 115, 115, 0.20);
|
||
--bg-bg-white: #ffffff;
|
||
--bg-bg-brand: #4b3fe3;
|
||
--bg-bg-brand-hover: #6a6fff;
|
||
--bg-bg-brand-active: #3f31c6;
|
||
--bg-bg-brand-disabled: rgba(75, 63, 227, 0.22);
|
||
--bg-bg-brand-popup: rgba(170, 183, 255, 0.36);
|
||
/* brand-sub 兼容(品牌色已统一,sub 映射为主品牌色) */
|
||
--bg-bg-brand-sub: var(--bg-bg-brand);
|
||
--bg-bg-brand-hover-sub: var(--bg-bg-brand-hover);
|
||
--bg-bg-brand-disabled-sub: var(--bg-bg-brand-disabled);
|
||
--bg-bg-brand-popup-sub: var(--bg-bg-brand-popup);
|
||
--bg-bg-invert: #262626;
|
||
--bg-bg-invert-hover: #404040;
|
||
--bg-bg-invert-active: #171717;
|
||
--bg-bg-invert-disabled: rgba(115, 115, 115, 0.20);
|
||
--bg-bg-marketplace-banner-overlay-start: rgba(82, 130, 193, 0);
|
||
--bg-bg-marketplace-banner-overlay-end: rgba(82, 130, 193, 0.8);
|
||
--bg-bg-marketplace-banner-control: rgba(0, 0, 0, 0.25);
|
||
--bg-bg-card: #fafafa;
|
||
--bg-bg-card-hover: #ffffff;
|
||
--bg-bg-marketplace-banner-plugin-tag: #e5f3ff;
|
||
--bg-bg-marketplace-banner-preview-mask-start: rgba(255, 255, 255, 0.9);
|
||
--bg-bg-marketplace-banner-preview-mask-end: rgba(255, 255, 255, 0.54);
|
||
--shadow-marketplace-banner-preview-card: 0px 6px 12px -1px rgba(0, 0, 0, 0.18), 0px 10px 24px -1px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-small: 0px 2.8023247718811035px 5.604649543762207px -0.4670540988445282px rgba(0, 0, 0, 0.18), 0px 4.670541763305664px 11.209299087524414px -0.4670540988445282px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-large: 0px 4.55377721786499px 9.10755443572998px -0.758962869644165px rgba(0, 0, 0, 0.18), 0px 7.589629650115967px 18.21510887145996px -0.758962869644165px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-input: 0px 0px 24px -1px rgba(24, 24, 24, 0.06), 0px -12px 8px -1px rgba(24, 24, 24, 0.02);
|
||
--chat-bg-card: var(--bg-bg-card);
|
||
--chat-bg-card-hover: var(--bg-bg-base-default);
|
||
--special-bgtabsoverlay: rgba(255, 255, 255, 0.12);
|
||
--special-tabsoverlay: rgba(193, 195, 205, 0.12);
|
||
--text-text-default: #171717;
|
||
--text-text-default-hover: #262626;
|
||
--text-text-default-active: #262626;
|
||
--text-text-secondary: #404040;
|
||
--text-text-secondary-hover: #171717;
|
||
--text-text-secondary-active: #171717;
|
||
--text-text-tertiary: #737373;
|
||
--text-text-disabled: #a1a1a1;
|
||
--text-text-brand: #4b3fe3;
|
||
--text-text-brand-hover: #6a6fff;
|
||
--text-text-brand-sub: var(--text-text-brand);
|
||
--text-text-brand-hover-sub: var(--text-text-brand-hover);
|
||
--text-text-onbrand: #171717;
|
||
--text-text-onaccent: #ffffff;
|
||
--text-text-marketplace-banner-on-light: #0a0a0a;
|
||
--text-text-marketplace-banner-plugin-tag: #054c8f;
|
||
--icon-icon-default: #262626;
|
||
--icon-icon-default-hover: #171717;
|
||
--icon-icon-default-active: #171717;
|
||
--icon-icon-secondary: #404040;
|
||
--icon-icon-secondary-hover: #262626;
|
||
--icon-icon-secondary-active: #262626;
|
||
--icon-icon-tertiary: #737373;
|
||
--icon-icon-disabled: #a1a1a1;
|
||
--icon-icon-brand: #4b3fe3;
|
||
--icon-icon-brand-hover: #6a6fff;
|
||
--icon-icon-brand-sub: var(--icon-icon-brand);
|
||
--icon-icon-brand-hover-sub: var(--icon-icon-brand-hover);
|
||
--icon-icon-onbrand: #0a0a0a;
|
||
--icon-icon-onaccent: #ffffff;
|
||
--icon-icon-white: #ffffff;
|
||
--border-border-neutral-l1: rgba(115, 115, 115, 0.12);
|
||
--border-border-neutral-l2: rgba(115, 115, 115, 0.18);
|
||
--border-border-neutral-l3: rgba(115, 115, 115, 0.36);
|
||
--border-border-brand: #4b3fe3;
|
||
--border-border-brand-sub: var(--border-border-brand);
|
||
--border-border-contrast: #000000;
|
||
--status-primary-default: #2f74ff;
|
||
--status-primary-hover: #4c88ff;
|
||
--status-primary-active: #1759dd;
|
||
--status-primary-surface-l1: rgba(47, 116, 255, 0.12);
|
||
--status-primary-surface-l2: rgba(47, 116, 255, 0.18);
|
||
--status-primary-surface-l3: rgba(47, 116, 255, 0.36);
|
||
--status-success-default: #15a877;
|
||
--status-success-hover: #2fb287;
|
||
--status-success-active: #1e8b56;
|
||
--status-success-surface-l1: rgba(64, 176, 139, 0.12);
|
||
--status-success-surface-l2: rgba(64, 176, 139, 0.18);
|
||
--status-success-surface-l3: rgba(64, 176, 139, 0.36);
|
||
--status-alert-default: #fea900;
|
||
--status-alert-hover: #ffb700;
|
||
--status-alert-active: #e59100;
|
||
--status-alert-surface-l1: rgba(254, 169, 0, 0.14);
|
||
--status-alert-surface-l2: rgba(254, 169, 0, 0.20);
|
||
--status-alert-surface-l3: rgba(254, 169, 0, 0.36);
|
||
--status-warning-default: #e27900;
|
||
--status-warning-hover: #f39a35;
|
||
--status-warning-active: #c46f11;
|
||
--status-warning-surface-l1: rgba(226, 121, 0, 0.12);
|
||
--status-warning-surface-l2: rgba(226, 121, 0, 0.16);
|
||
--status-warning-surface-l3: rgba(226, 121, 0, 0.36);
|
||
--status-error-default: #e8463a;
|
||
--status-error-hover: #ea574c;
|
||
--status-error-active: #c9382f;
|
||
--status-error-surface-l1: rgba(232, 70, 58, 0.12);
|
||
--status-error-surface-l2: rgba(232, 70, 58, 0.16);
|
||
--status-error-surface-l3: rgba(232, 70, 58, 0.36);
|
||
--accent-accent-teal: #00b983;
|
||
--accent-accent-coral: #ff6b45;
|
||
--accent-accent-amber: #f2a90c;
|
||
--accent-accent-lime: #5fc000;
|
||
--accent-accent-cyan: #00b6f5;
|
||
--accent-accent-blue: #3f85ff;
|
||
--accent-accent-magenta: #f53cff;
|
||
--accent-accent-violet: #9570ff;
|
||
--accent-accent-slate: #747e94;
|
||
--code-code-text: #17181a;
|
||
--code-code-doc: #8393a3;
|
||
--code-code-link: #2f74ff;
|
||
--code-code-number: #e54595;
|
||
--code-code-action: #5f36b2;
|
||
--code-code-instruction: #b15ef2;
|
||
--code-code-function: #ff5d4d;
|
||
--code-code-constant: #175ce6;
|
||
--code-code-parameter: #4da621;
|
||
--code-code-attribute: #c99100;
|
||
--code-code-tag: #e24864;
|
||
--code-code-terminal: #17181a;
|
||
--code-code-contrast: #17181a;
|
||
--code-code-editor: #17181a;
|
||
--special-white: #ffffff;
|
||
--special-black: #000000;
|
||
--viz-viz-series-amber: #edaa45;
|
||
--viz-viz-series-coral: #f87454;
|
||
--viz-viz-series-indigo: #b6a3ff;
|
||
--viz-viz-series-lime: #a6ea39;
|
||
--viz-viz-series-magenta: #fb9dd7;
|
||
--viz-viz-series-mint: #1dc981;
|
||
--viz-viz-series-sky: #22a5f7;
|
||
--viz-viz-series-slate: #859ead;
|
||
--viz-viz-series-teal: #59e8e8;
|
||
--viz-viz-series-violet: #b655fc;
|
||
--viz-viz-ui-bg-chart: #ffffff;
|
||
--viz-viz-ui-bg-tooltip: #fafafa;
|
||
--viz-viz-ui-chart-axis: rgba(115, 115, 115, 0.18);
|
||
--viz-viz-ui-chart-subtitle: #404040;
|
||
--viz-viz-ui-chart-tick: #404040;
|
||
--viz-viz-ui-chart-title: #171717;
|
||
--viz-viz-ui-legend-label: #404040;
|
||
--viz-viz-ui-legend-value: #171717;
|
||
--brand-blue-100: #e5f3ff;
|
||
--brand-blue-200: #cce6ff;
|
||
--brand-blue-300: #b2daff;
|
||
--brand-blue-400: #99ceff;
|
||
--brand-blue-500: #80c1ff;
|
||
--brand-blue-600: #64b4ff;
|
||
--brand-blue-700: #3792e6;
|
||
--brand-blue-800: #1071cb;
|
||
--brand-blue-900: #054c8f;
|
||
--brand-blue-1000: #00284d;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-purple-100: #e8e5ff;
|
||
--brand-purple-200: #d2ccff;
|
||
--brand-purple-300: #bbb2ff;
|
||
--brand-purple-400: #a599ff;
|
||
--brand-purple-500: #8e80ff;
|
||
--brand-purple-600: #7864ff;
|
||
--brand-purple-700: #4c37e6;
|
||
--brand-purple-800: #2610cb;
|
||
--brand-purple-900: #15058f;
|
||
--brand-purple-1000: #09004d;
|
||
--brand-red-100: #ffe5e5;
|
||
--brand-red-200: #ffcccc;
|
||
--brand-red-300: #ffb2b2;
|
||
--brand-red-400: #ff9999;
|
||
--brand-red-500: #ff8080;
|
||
--brand-red-600: #ff6464;
|
||
--brand-red-700: #e63737;
|
||
--brand-red-800: #cb1010;
|
||
--brand-red-900: #8f0505;
|
||
--brand-red-1000: #4d0000;
|
||
--brand-yellow-100: #fff6e5;
|
||
--brand-yellow-200: #ffeccc;
|
||
--brand-yellow-300: #ffe3b2;
|
||
--brand-yellow-400: #ffda99;
|
||
--brand-yellow-500: #ffd080;
|
||
--brand-yellow-600: #ffc864;
|
||
--brand-yellow-700: #e6a637;
|
||
--brand-yellow-800: #cb8710;
|
||
--brand-yellow-900: #8f5c05;
|
||
--brand-yellow-1000: #4d3000;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-neutral-grey-100: #f2f2f2;
|
||
--brand-neutral-grey-200: #e3e3e3;
|
||
--brand-neutral-grey-300: #d6d6d6;
|
||
--brand-neutral-grey-400: #c7c7c7;
|
||
--brand-neutral-grey-500: #bababa;
|
||
--brand-neutral-grey-600: #ababab;
|
||
--brand-neutral-grey-700: #8a8a8a;
|
||
--brand-neutral-grey-800: #686868;
|
||
--brand-neutral-grey-900: #474747;
|
||
--brand-neutral-grey-1000: #262626;
|
||
--brand-brand-50: #f2f7ff;
|
||
--brand-brand-100: #e5eaff;
|
||
--brand-brand-200: #cfd8ff;
|
||
--brand-brand-300: #aab7ff;
|
||
--brand-brand-400: #8894ff;
|
||
--brand-brand-500: #6a6fff;
|
||
--brand-brand-600: #4b3fe3;
|
||
--brand-brand-700: #3f31c6;
|
||
--brand-brand-800: #2c2290;
|
||
--brand-brand-900: #1a1759;
|
||
--brand-brand-950: #010109;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
|
||
--body-body-xs: 10px/1.5 var(--font-family-default);
|
||
--body-body-sm: 11px/1.5 var(--font-family-default);
|
||
--body-body-sm-strong: 600 11px/1.5 var(--font-family-default);
|
||
--body-body-md: 12px/1.5 var(--font-family-default);
|
||
--body-body-md-strong: 600 12px/1.5 var(--font-family-default);
|
||
--body-body-base: 14px/1.5 var(--font-family-default);
|
||
--body-body-base-strong: 600 14px/1.5 var(--font-family-default);
|
||
--heading-heading-3xs: 600 10px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xs: 600 11px/1.4 var(--font-family-heading);
|
||
--heading-heading-xs: 600 12px/1.4 var(--font-family-heading);
|
||
--heading-heading-sm: 600 13px/1.4 var(--font-family-heading);
|
||
--heading-heading-md: 600 14px/1.4 var(--font-family-heading);
|
||
--heading-heading-lg: 600 16px/1.4 var(--font-family-heading);
|
||
--heading-heading-xl: 600 20px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xl: 600 24px/1.4 var(--font-family-heading);
|
||
--heading-heading-3xl: 600 32px/1.4 var(--font-family-heading);
|
||
|
||
--bg-bg-overlay-l0: rgba(86, 99, 119, 0.03);
|
||
--bg-primary-item: rgba(86, 99, 119, 0.15);
|
||
--bg-primary-item-hover: rgba(86, 99, 119, 0.22);
|
||
--border-primary-item: rgba(77, 107, 153, 0.09);
|
||
--border-primary-item-hover: rgba(77, 107, 153, 0.15);
|
||
--bg-bg-menu-old: #f8f9fa;
|
||
/* 首页输入框边框颜色(纯色,用于内凹圆弧等需要精确边框的场景) */
|
||
--homepage-input-border-color: #dfe3eb;
|
||
|
||
--welcome-logo-bg: var(--bg-bg-brand, #0fdc78);
|
||
--welcome-logo-color: #000000;
|
||
|
||
--user-message-bg-solid: #E3F8ED;
|
||
--user-message-bg-solid-transparent: rgba(227, 248, 237, 0);
|
||
--user-message-bg-solid-sub: #E9E6FF;
|
||
--user-message-bg-solid-sub-transparent: rgba(233, 230, 255, 0);
|
||
--sheet-text-color: #000000;
|
||
--slash-mention-bg: rgba(63, 133, 255, 0.15);
|
||
--builtin-slash-mention-bg: rgba(149, 112, 255, 0.15);
|
||
|
||
--gradient-golden: linear-gradient(180deg, #c0a115 0%, #dfbd27 100%);
|
||
--special-bggoldoverlay: rgba(210, 181, 19, 0.12);
|
||
--query-tag-bg-grey: rgba(116, 126, 148, 0.12);
|
||
|
||
--bg-bg-brand-old: #0fdc78;
|
||
--gradient-brand: linear-gradient(90deg, #0ac27b 0%, #0ecd70 36%, #06c179 72%, #63c5b1 100%);
|
||
--text-text-preformat-foreground: #a31515;
|
||
}
|
||
|
||
[data-theme='dark'], .vs-dark.solo-lite {
|
||
--shadow-elevation-50: 0 1px 2px -1px rgba(0, 0, 0, 0.45);
|
||
--shadow-elevation-100: 0 3px 9px 0 rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-100-float: 0 -3px 9px 0 rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-200: 0 6px 24px -1px rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-200-reverse: 0 -6px 24px -1px rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-300: 0 2px 8px -1px rgba(0, 0, 0, 0.18), 0 10px 24px -1px rgba(0, 0, 0, 0.30);
|
||
--shadow-elevation-100-tooltip: var(--shadow-elevation-100);
|
||
--shadow-elevation-200-menu-panel: var(--shadow-elevation-200);
|
||
--shadow-elevation-300-modal-panel: var(--shadow-elevation-300);
|
||
|
||
/* 输入框阴影颜色 */
|
||
--shadow-chat-input: 0 3px 8px 0 rgba(24, 24, 24, 0.08), 0 6px 24px -1px rgba(24, 24, 24, 0.12);
|
||
--shadow-chat-input-focused: 0 4px 12px 0 rgba(24, 24, 24, 0.08), 0 6px 32px -1px rgba(24, 24, 24, 0.12);
|
||
|
||
--bg-bg-base-default: #171717;
|
||
--bg-bg-base-secondary: #262626;
|
||
--bg-bg-base-tertiary: #404040;
|
||
--bg-bg-menu: #171717;
|
||
--bg-bg-tooltip: #171717;
|
||
--bg-bg-input: #171717;
|
||
--bg-bg-overlay-l1: rgba(212, 212, 212, 0.04);
|
||
--bg-bg-overlay-l2: rgba(212, 212, 212, 0.06);
|
||
--bg-bg-overlay-l3: rgba(212, 212, 212, 0.08);
|
||
--bg-bg-overlay-l4: rgba(212, 212, 212, 0.12);
|
||
--bg-bg-white: #ffffff;
|
||
--bg-bg-brand: #4b3fe3;
|
||
--bg-bg-brand-hover: #6a6fff;
|
||
--bg-bg-brand-active: #3f31c6;
|
||
--bg-bg-brand-disabled: rgba(75, 63, 227, 0.35);
|
||
--bg-bg-brand-popup: rgba(106, 111, 255, 0.15);
|
||
--bg-bg-brand-sub: var(--bg-bg-brand);
|
||
--bg-bg-brand-hover-sub: var(--bg-bg-brand-hover);
|
||
--bg-bg-brand-disabled-sub: var(--bg-bg-brand-disabled);
|
||
--bg-bg-brand-popup-sub: var(--bg-bg-brand-popup);
|
||
--bg-bg-invert: #e5e5e5;
|
||
--bg-bg-invert-hover: #f5f5f5;
|
||
--bg-bg-invert-active: #e5e5e5;
|
||
--bg-bg-invert-disabled: rgba(212, 212, 212, 0.06);
|
||
--bg-bg-marketplace-banner-overlay-start: rgba(82, 130, 193, 0);
|
||
--bg-bg-marketplace-banner-overlay-end: rgba(82, 130, 193, 0.8);
|
||
--bg-bg-marketplace-banner-control: rgba(0, 0, 0, 0.25);
|
||
--bg-bg-card: #202020;
|
||
--bg-bg-card-hover: #171717;
|
||
--bg-bg-marketplace-banner-plugin-tag: #e5f3ff;
|
||
--bg-bg-marketplace-banner-preview-mask-start: rgba(255, 255, 255, 0.9);
|
||
--bg-bg-marketplace-banner-preview-mask-end: rgba(255, 255, 255, 0.54);
|
||
--shadow-marketplace-banner-preview-card: 0px 6px 12px -1px rgba(0, 0, 0, 0.18), 0px 10px 24px -1px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-small: 0px 2.8023247718811035px 5.604649543762207px -0.4670540988445282px rgba(0, 0, 0, 0.18), 0px 4.670541763305664px 11.209299087524414px -0.4670540988445282px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-large: 0px 4.55377721786499px 9.10755443572998px -0.758962869644165px rgba(0, 0, 0, 0.18), 0px 7.589629650115967px 18.21510887145996px -0.758962869644165px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-input: 0px 0px 24px -1px rgba(24, 24, 24, 0.06), 0px -12px 8px -1px rgba(24, 24, 24, 0.02);
|
||
--chat-bg-card: #202020;
|
||
--chat-bg-card-hover: var(--bg-bg-base-default);
|
||
--special-bgtabsoverlay: rgba(0, 0, 0, 0.20);
|
||
--special-tabsoverlay: rgba(13, 14, 15, 0.18);
|
||
--text-text-default: #e5e5e5;
|
||
--text-text-default-hover: #fafafa;
|
||
--text-text-default-active: #fafafa;
|
||
--text-text-secondary: #a1a1a1;
|
||
--text-text-secondary-hover: #e5e5e5;
|
||
--text-text-secondary-active: #e5e5e5;
|
||
--text-text-tertiary: #737373;
|
||
--text-text-disabled: #525252;
|
||
--text-text-brand: #6a6fff;
|
||
--text-text-brand-hover: #4b3fe3;
|
||
--text-text-brand-sub: var(--text-text-brand);
|
||
--text-text-brand-hover-sub: var(--text-text-brand-hover);
|
||
--text-text-onbrand: #171717;
|
||
--text-text-onaccent: #171717;
|
||
--text-text-marketplace-banner-on-light: #0a0a0a;
|
||
--text-text-marketplace-banner-plugin-tag: #054c8f;
|
||
--icon-icon-default: #e5e5e5;
|
||
--icon-icon-default-hover: #fafafa;
|
||
--icon-icon-default-active: #fafafa;
|
||
--icon-icon-secondary: #a1a1a1;
|
||
--icon-icon-secondary-hover: #e5e5e5;
|
||
--icon-icon-secondary-active: #e5e5e5;
|
||
--icon-icon-tertiary: #737373;
|
||
--icon-icon-disabled: #525252;
|
||
--icon-icon-brand: #6a6fff;
|
||
--icon-icon-brand-hover: #4b3fe3;
|
||
--icon-icon-brand-sub: var(--icon-icon-brand);
|
||
--icon-icon-brand-hover-sub: var(--icon-icon-brand-hover);
|
||
--icon-icon-onbrand: #0a0a0a;
|
||
--icon-icon-onaccent: #0A0A0A;
|
||
--icon-icon-white: #ffffff;
|
||
--border-border-neutral-l1: rgba(229, 229, 229, 0.10);
|
||
--border-border-neutral-l2: rgba(229, 229, 229, 0.16);
|
||
--border-border-neutral-l3: rgba(229, 229, 229, 0.20);
|
||
--border-border-brand: #6a6fff;
|
||
--border-border-brand-sub: var(--border-border-brand);
|
||
--border-border-contrast: #ffffff;
|
||
--status-primary-default: #387bff;
|
||
--status-primary-hover: #4c88ff;
|
||
--status-primary-active: #1759dd;
|
||
--status-primary-surface-l1: rgba(53, 121, 255, 0.18);
|
||
--status-primary-surface-l2: rgba(53, 121, 255, 0.28);
|
||
--status-primary-surface-l3: rgba(53, 121, 255, 0.36);
|
||
--status-success-default: #33c192;
|
||
--status-success-hover: #5ed4ad;
|
||
--status-success-active: #27b082;
|
||
--status-success-surface-l1: rgba(0, 165, 110, 0.18);
|
||
--status-success-surface-l2: rgba(0, 165, 110, 0.28);
|
||
--status-success-surface-l3: rgba(0, 165, 110, 0.36);
|
||
--status-alert-default: #d29d00;
|
||
--status-alert-hover: #dfb949;
|
||
--status-alert-active: #ab8820;
|
||
--status-alert-surface-l1: rgba(210, 157, 0, 0.16);
|
||
--status-alert-surface-l2: rgba(210, 157, 0, 0.28);
|
||
--status-alert-surface-l3: rgba(210, 157, 0, 0.36);
|
||
--status-warning-default: #d27e24;
|
||
--status-warning-hover: #d78b28;
|
||
--status-warning-active: #b46510;
|
||
--status-warning-surface-l1: rgba(210, 126, 36, 0.16);
|
||
--status-warning-surface-l2: rgba(210, 126, 36, 0.28);
|
||
--status-warning-surface-l3: rgba(210, 126, 36, 0.36);
|
||
--status-error-default: #f65a5a;
|
||
--status-error-hover: #f86262;
|
||
--status-error-active: #b33636;
|
||
--status-error-surface-l1: rgba(246, 70, 70, 0.18);
|
||
--status-error-surface-l2: rgba(246, 70, 70, 0.28);
|
||
--status-error-surface-l3: rgba(246, 70, 70, 0.36);
|
||
--accent-accent-teal: #2dd288;
|
||
--accent-accent-coral: #ff9392;
|
||
--accent-accent-amber: #dcb364;
|
||
--accent-accent-lime: #8acb3a;
|
||
--accent-accent-cyan: #04cbe5;
|
||
--accent-accent-blue: #7bb8ff;
|
||
--accent-accent-magenta: #ec93ff;
|
||
--accent-accent-violet: #bfa5ff;
|
||
--accent-accent-slate: #afb9cf;
|
||
--code-code-text: #e0e3ee;
|
||
--code-code-doc: #7f838c;
|
||
--code-code-link: #3c7eff;
|
||
--code-code-number: #f48cca;
|
||
--code-code-action: #b38cff;
|
||
--code-code-instruction: #f0d8ff;
|
||
--code-code-function: #f29d79;
|
||
--code-code-constant: #80bbff;
|
||
--code-code-parameter: #82d99f;
|
||
--code-code-attribute: #ded47e;
|
||
--code-code-tag: #f2858c;
|
||
--code-code-terminal: #e0e3ee;
|
||
--code-code-contrast: #e0e3ee;
|
||
--code-code-editor: #e0e3ee;
|
||
--special-white: #ffffff;
|
||
--special-black: #000000;
|
||
--viz-viz-series-amber: #edaa45;
|
||
--viz-viz-series-coral: #f87454;
|
||
--viz-viz-series-indigo: #b6a3ff;
|
||
--viz-viz-series-lime: #a6ea39;
|
||
--viz-viz-series-magenta: #fb9dd7;
|
||
--viz-viz-series-mint: #1dc981;
|
||
--viz-viz-series-sky: #22a5f7;
|
||
--viz-viz-series-slate: #859ead;
|
||
--viz-viz-series-teal: #78f2f2;
|
||
--viz-viz-series-violet: #b655fc;
|
||
--viz-viz-ui-bg-chart: #171717;
|
||
--viz-viz-ui-bg-tooltip: #0a0a0a;
|
||
--viz-viz-ui-chart-axis: rgba(229, 229, 229, 0.16);
|
||
--viz-viz-ui-chart-subtitle: #737373;
|
||
--viz-viz-ui-chart-tick: #737373;
|
||
--viz-viz-ui-chart-title: #e5e5e5;
|
||
--viz-viz-ui-legend-label: #737373;
|
||
--viz-viz-ui-legend-value: #e5e5e5;
|
||
--brand-blue-100: #e5f3ff;
|
||
--brand-blue-200: #cce6ff;
|
||
--brand-blue-300: #b2daff;
|
||
--brand-blue-400: #99ceff;
|
||
--brand-blue-500: #80c1ff;
|
||
--brand-blue-600: #64b4ff;
|
||
--brand-blue-700: #3792e6;
|
||
--brand-blue-800: #1071cb;
|
||
--brand-blue-900: #054c8f;
|
||
--brand-blue-1000: #00284d;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-purple-100: #e8e5ff;
|
||
--brand-purple-200: #d2ccff;
|
||
--brand-purple-300: #bbb2ff;
|
||
--brand-purple-400: #a599ff;
|
||
--brand-purple-500: #8e80ff;
|
||
--brand-purple-600: #7864ff;
|
||
--brand-purple-700: #4c37e6;
|
||
--brand-purple-800: #2610cb;
|
||
--brand-purple-900: #15058f;
|
||
--brand-purple-1000: #09004d;
|
||
--brand-red-100: #ffe5e5;
|
||
--brand-red-200: #ffcccc;
|
||
--brand-red-300: #ffb2b2;
|
||
--brand-red-400: #ff9999;
|
||
--brand-red-500: #ff8080;
|
||
--brand-red-600: #ff6464;
|
||
--brand-red-700: #e63737;
|
||
--brand-red-800: #cb1010;
|
||
--brand-red-900: #8f0505;
|
||
--brand-red-1000: #4d0000;
|
||
--brand-yellow-100: #fff6e5;
|
||
--brand-yellow-200: #ffeccc;
|
||
--brand-yellow-300: #ffe3b2;
|
||
--brand-yellow-400: #ffda99;
|
||
--brand-yellow-500: #ffd080;
|
||
--brand-yellow-600: #ffc864;
|
||
--brand-yellow-700: #e6a637;
|
||
--brand-yellow-800: #cb8710;
|
||
--brand-yellow-900: #8f5c05;
|
||
--brand-yellow-1000: #4d3000;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-neutral-grey-100: #f2f2f2;
|
||
--brand-neutral-grey-200: #e3e3e3;
|
||
--brand-neutral-grey-300: #d6d6d6;
|
||
--brand-neutral-grey-400: #c7c7c7;
|
||
--brand-neutral-grey-500: #bababa;
|
||
--brand-neutral-grey-600: #ababab;
|
||
--brand-neutral-grey-700: #8a8a8a;
|
||
--brand-neutral-grey-800: #686868;
|
||
--brand-neutral-grey-900: #474747;
|
||
--brand-neutral-grey-1000: #262626;
|
||
--brand-brand-50: #f2f7ff;
|
||
--brand-brand-100: #e5eaff;
|
||
--brand-brand-200: #cfd8ff;
|
||
--brand-brand-300: #aab7ff;
|
||
--brand-brand-400: #8894ff;
|
||
--brand-brand-500: #6a6fff;
|
||
--brand-brand-600: #4b3fe3;
|
||
--brand-brand-700: #3f31c6;
|
||
--brand-brand-800: #2c2290;
|
||
--brand-brand-900: #1a1759;
|
||
--brand-brand-950: #010109;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
|
||
--body-body-xs: 10px/1.5 var(--font-family-default);
|
||
--body-body-sm: 11px/1.5 var(--font-family-default);
|
||
--body-body-sm-strong: 600 11px/1.5 var(--font-family-default);
|
||
--body-body-md: 12px/1.5 var(--font-family-default);
|
||
--body-body-md-strong: 600 12px/1.5 var(--font-family-default);
|
||
--body-body-base: 14px/1.5 var(--font-family-default);
|
||
--body-body-base-strong: 600 14px/1.5 var(--font-family-default);
|
||
--heading-heading-3xs: 600 10px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xs: 600 11px/1.4 var(--font-family-heading);
|
||
--heading-heading-xs: 600 12px/1.4 var(--font-family-heading);
|
||
--heading-heading-sm: 600 13px/1.4 var(--font-family-heading);
|
||
--heading-heading-md: 600 14px/1.4 var(--font-family-heading);
|
||
--heading-heading-lg: 600 16px/1.4 var(--font-family-heading);
|
||
--heading-heading-xl: 600 20px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xl: 600 24px/1.4 var(--font-family-heading);
|
||
--heading-heading-3xl: 600 32px/1.4 var(--font-family-heading);
|
||
|
||
--bg-bg-overlay-l0: rgba(224, 226, 242, 0.03);
|
||
--bg-primary-item: rgba(224, 226, 242, 0.08);
|
||
--bg-primary-item-hover: rgba(224, 226, 242, 0.12);
|
||
--border-primary-item: rgba(224, 226, 242, 0.06);
|
||
--border-primary-item-hover: rgba(224, 226, 242, 0.1);
|
||
/* 首页输入框边框颜色(纯色,用于内凹圆弧等需要精确边框的场景) */
|
||
--homepage-input-border-color: #343538;
|
||
|
||
--welcome-logo-bg: #000000;
|
||
--welcome-logo-color: var(--bg-bg-brand, #0fdc78);
|
||
|
||
--user-message-bg-solid: #1D352A;
|
||
--user-message-bg-solid-transparent: rgba(29, 53, 42, 0);
|
||
--user-message-bg-solid-sub: #2B2A38;
|
||
--user-message-bg-solid-sub-transparent: rgba(43, 42, 56, 0);
|
||
--sheet-text-color: #ffffff;
|
||
--slash-mention-bg: rgba(63, 133, 255, 0.15);
|
||
--builtin-slash-mention-bg: rgba(149, 112, 255, 0.15);
|
||
|
||
--gradient-golden: linear-gradient(180deg, #DAB444 0%, #FFEA8E 100%);
|
||
--special-bggoldoverlay: rgba(139, 128, 65, 0.12);
|
||
--query-tag-bg-grey: rgba(116, 126, 148, 0.18);
|
||
|
||
--bg-bg-brand-old: #32f08c;
|
||
--gradient-brand: linear-gradient(90deg, #3ee1a3 0%, #32f08c 36%, #60f2bd 71.63%, #a0fde7 100%);
|
||
--text-text-preformat-foreground: #d7ba7d;
|
||
}
|
||
|
||
[data-theme='dark-blue'], .vs-dark.solo-lite {
|
||
--shadow-elevation-50: 0 1px 2px -1px rgba(0, 0, 0, 0.45);
|
||
--shadow-elevation-100: 0 3px 9px 0 rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-100-float: 0 -3px 9px 0 rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-200: 0 6px 24px -1px rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-200-reverse: 0 -6px 24px -1px rgba(0, 0, 0, 0.25);
|
||
--shadow-elevation-300: 0 2px 8px -1px rgba(0, 0, 0, 0.18), 0 10px 24px -1px rgba(0, 0, 0, 0.30);
|
||
--shadow-elevation-100-tooltip: var(--shadow-elevation-100);
|
||
--shadow-elevation-200-menu-panel: var(--shadow-elevation-200);
|
||
--shadow-elevation-300-modal-panel: var(--shadow-elevation-300);
|
||
|
||
/* 输入框阴影颜色 */
|
||
--shadow-chat-input: 0 3px 8px 0 rgba(24, 24, 24, 0.08), 0 6px 24px -1px rgba(24, 24, 24, 0.12);
|
||
--shadow-chat-input-focused: 0 4px 12px 0 rgba(24, 24, 24, 0.08), 0 6px 32px -1px rgba(24, 24, 24, 0.12);
|
||
|
||
--bg-bg-base-default: #171717;
|
||
--bg-bg-base-secondary: #262626;
|
||
--bg-bg-base-tertiary: #404040;
|
||
--bg-bg-menu: #171717;
|
||
--bg-bg-tooltip: #171717;
|
||
--bg-bg-input: #171717;
|
||
--bg-bg-overlay-l1: rgba(212, 212, 212, 0.04);
|
||
--bg-bg-overlay-l2: rgba(212, 212, 212, 0.06);
|
||
--bg-bg-overlay-l3: rgba(212, 212, 212, 0.08);
|
||
--bg-bg-overlay-l4: rgba(212, 212, 212, 0.12);
|
||
--bg-bg-white: #ffffff;
|
||
--bg-bg-brand: #4b3fe3;
|
||
--bg-bg-brand-hover: #6a6fff;
|
||
--bg-bg-brand-active: #3f31c6;
|
||
--bg-bg-brand-disabled: rgba(75, 63, 227, 0.35);
|
||
--bg-bg-brand-popup: rgba(106, 111, 255, 0.15);
|
||
--bg-bg-brand-sub: var(--bg-bg-brand);
|
||
--bg-bg-brand-hover-sub: var(--bg-bg-brand-hover);
|
||
--bg-bg-brand-disabled-sub: var(--bg-bg-brand-disabled);
|
||
--bg-bg-brand-popup-sub: var(--bg-bg-brand-popup);
|
||
--bg-bg-invert: #e5e5e5;
|
||
--bg-bg-invert-hover: #f5f5f5;
|
||
--bg-bg-invert-active: #e5e5e5;
|
||
--bg-bg-invert-disabled: rgba(212, 212, 212, 0.06);
|
||
--bg-bg-marketplace-banner-overlay-start: rgba(82, 130, 193, 0);
|
||
--bg-bg-marketplace-banner-overlay-end: rgba(82, 130, 193, 0.8);
|
||
--bg-bg-marketplace-banner-control: rgba(0, 0, 0, 0.25);
|
||
--bg-bg-card: #202020;
|
||
--bg-bg-card-hover: #171717;
|
||
--bg-bg-marketplace-banner-plugin-tag: #e5f3ff;
|
||
--bg-bg-marketplace-banner-preview-mask-start: rgba(255, 255, 255, 0.9);
|
||
--bg-bg-marketplace-banner-preview-mask-end: rgba(255, 255, 255, 0.54);
|
||
--shadow-marketplace-banner-preview-card: 0px 6px 12px -1px rgba(0, 0, 0, 0.18), 0px 10px 24px -1px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-small: 0px 2.8023247718811035px 5.604649543762207px -0.4670540988445282px rgba(0, 0, 0, 0.18), 0px 4.670541763305664px 11.209299087524414px -0.4670540988445282px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-card-large: 0px 4.55377721786499px 9.10755443572998px -0.758962869644165px rgba(0, 0, 0, 0.18), 0px 7.589629650115967px 18.21510887145996px -0.758962869644165px rgba(0, 0, 0, 0.2);
|
||
--shadow-marketplace-banner-preview-input: 0px 0px 24px -1px rgba(24, 24, 24, 0.06), 0px -12px 8px -1px rgba(24, 24, 24, 0.02);
|
||
--chat-bg-card: var(--bg-bg-card);
|
||
--chat-bg-card-hover: var(--bg-bg-base-default);
|
||
--special-bgtabsoverlay: rgba(0, 0, 0, 0.20);
|
||
--special-tabsoverlay: rgba(13, 14, 15, 0.18);
|
||
--text-text-default: #e5e5e5;
|
||
--text-text-default-hover: #fafafa;
|
||
--text-text-default-active: #fafafa;
|
||
--text-text-secondary: #a1a1a1;
|
||
--text-text-secondary-hover: #e5e5e5;
|
||
--text-text-secondary-active: #e5e5e5;
|
||
--text-text-tertiary: #737373;
|
||
--text-text-disabled: #525252;
|
||
--text-text-brand: #6a6fff;
|
||
--text-text-brand-hover: #4b3fe3;
|
||
--text-text-brand-sub: var(--text-text-brand);
|
||
--text-text-brand-hover-sub: var(--text-text-brand-hover);
|
||
--text-text-onbrand: #171717;
|
||
--text-text-onaccent: #171717;
|
||
--text-text-marketplace-banner-on-light: #0a0a0a;
|
||
--text-text-marketplace-banner-plugin-tag: #054c8f;
|
||
--icon-icon-default: #e5e5e5;
|
||
--icon-icon-default-hover: #fafafa;
|
||
--icon-icon-default-active: #fafafa;
|
||
--icon-icon-secondary: #a1a1a1;
|
||
--icon-icon-secondary-hover: #e5e5e5;
|
||
--icon-icon-secondary-active: #e5e5e5;
|
||
--icon-icon-tertiary: #737373;
|
||
--icon-icon-disabled: #525252;
|
||
--icon-icon-brand: #6a6fff;
|
||
--icon-icon-brand-hover: #4b3fe3;
|
||
--icon-icon-brand-sub: var(--icon-icon-brand);
|
||
--icon-icon-brand-hover-sub: var(--icon-icon-brand-hover);
|
||
--icon-icon-onbrand: #0a0a0a;
|
||
--icon-icon-onaccent: #0A0A0A;
|
||
--icon-icon-white: #ffffff;
|
||
--border-border-neutral-l1: rgba(229, 229, 229, 0.10);
|
||
--border-border-neutral-l2: rgba(229, 229, 229, 0.16);
|
||
--border-border-neutral-l3: rgba(229, 229, 229, 0.20);
|
||
--border-border-brand: #6a6fff;
|
||
--border-border-brand-sub: var(--border-border-brand);
|
||
--border-border-contrast: #ffffff;
|
||
--status-primary-default: #387bff;
|
||
--status-primary-hover: #4c88ff;
|
||
--status-primary-active: #1759dd;
|
||
--status-primary-surface-l1: rgba(53, 121, 255, 0.18);
|
||
--status-primary-surface-l2: rgba(53, 121, 255, 0.28);
|
||
--status-primary-surface-l3: rgba(53, 121, 255, 0.36);
|
||
--status-success-default: #33c192;
|
||
--status-success-hover: #5ed4ad;
|
||
--status-success-active: #27b082;
|
||
--status-success-surface-l1: rgba(0, 165, 110, 0.18);
|
||
--status-success-surface-l2: rgba(0, 165, 110, 0.28);
|
||
--status-success-surface-l3: rgba(0, 165, 110, 0.36);
|
||
--status-alert-default: #d29d00;
|
||
--status-alert-hover: #dfb949;
|
||
--status-alert-active: #ab8820;
|
||
--status-alert-surface-l1: rgba(210, 157, 0, 0.16);
|
||
--status-alert-surface-l2: rgba(210, 157, 0, 0.28);
|
||
--status-alert-surface-l3: rgba(210, 157, 0, 0.36);
|
||
--status-warning-default: #d27e24;
|
||
--status-warning-hover: #d78b28;
|
||
--status-warning-active: #b46510;
|
||
--status-warning-surface-l1: rgba(210, 126, 36, 0.16);
|
||
--status-warning-surface-l2: rgba(210, 126, 36, 0.28);
|
||
--status-warning-surface-l3: rgba(210, 126, 36, 0.36);
|
||
--status-error-default: #f65a5a;
|
||
--status-error-hover: #f86262;
|
||
--status-error-active: #b33636;
|
||
--status-error-surface-l1: rgba(246, 70, 70, 0.18);
|
||
--status-error-surface-l2: rgba(246, 70, 70, 0.28);
|
||
--status-error-surface-l3: rgba(246, 70, 70, 0.36);
|
||
--accent-accent-teal: #2dd288;
|
||
--accent-accent-coral: #ff9392;
|
||
--accent-accent-amber: #dcb364;
|
||
--accent-accent-lime: #8acb3a;
|
||
--accent-accent-cyan: #04cbe5;
|
||
--accent-accent-blue: #7bb8ff;
|
||
--accent-accent-magenta: #ec93ff;
|
||
--accent-accent-violet: #bfa5ff;
|
||
--accent-accent-slate: #afb9cf;
|
||
--code-code-text: #e0e3ee;
|
||
--code-code-doc: #7f838c;
|
||
--code-code-link: #3c7eff;
|
||
--code-code-number: #f48cca;
|
||
--code-code-action: #b38cff;
|
||
--code-code-instruction: #f0d8ff;
|
||
--code-code-function: #f29d79;
|
||
--code-code-constant: #80bbff;
|
||
--code-code-parameter: #82d99f;
|
||
--code-code-attribute: #ded47e;
|
||
--code-code-tag: #f2858c;
|
||
--code-code-terminal: #e0e3ee;
|
||
--code-code-contrast: #e0e3ee;
|
||
--code-code-editor: #e0e3ee;
|
||
--special-white: #ffffff;
|
||
--special-black: #000000;
|
||
--viz-viz-series-amber: #edaa45;
|
||
--viz-viz-series-coral: #f87454;
|
||
--viz-viz-series-indigo: #b6a3ff;
|
||
--viz-viz-series-lime: #a6ea39;
|
||
--viz-viz-series-magenta: #fb9dd7;
|
||
--viz-viz-series-mint: #1dc981;
|
||
--viz-viz-series-sky: #22a5f7;
|
||
--viz-viz-series-slate: #859ead;
|
||
--viz-viz-series-teal: #78f2f2;
|
||
--viz-viz-series-violet: #b655fc;
|
||
--viz-viz-ui-bg-chart: #171717;
|
||
--viz-viz-ui-bg-tooltip: #0a0a0a;
|
||
--viz-viz-ui-chart-axis: rgba(229, 229, 229, 0.16);
|
||
--viz-viz-ui-chart-subtitle: #737373;
|
||
--viz-viz-ui-chart-tick: #737373;
|
||
--viz-viz-ui-chart-title: #e5e5e5;
|
||
--viz-viz-ui-legend-label: #737373;
|
||
--viz-viz-ui-legend-value: #e5e5e5;
|
||
--brand-blue-100: #e5f3ff;
|
||
--brand-blue-200: #cce6ff;
|
||
--brand-blue-300: #b2daff;
|
||
--brand-blue-400: #99ceff;
|
||
--brand-blue-500: #80c1ff;
|
||
--brand-blue-600: #64b4ff;
|
||
--brand-blue-700: #3792e6;
|
||
--brand-blue-800: #1071cb;
|
||
--brand-blue-900: #054c8f;
|
||
--brand-blue-1000: #00284d;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-purple-100: #e8e5ff;
|
||
--brand-purple-200: #d2ccff;
|
||
--brand-purple-300: #bbb2ff;
|
||
--brand-purple-400: #a599ff;
|
||
--brand-purple-500: #8e80ff;
|
||
--brand-purple-600: #7864ff;
|
||
--brand-purple-700: #4c37e6;
|
||
--brand-purple-800: #2610cb;
|
||
--brand-purple-900: #15058f;
|
||
--brand-purple-1000: #09004d;
|
||
--brand-red-100: #ffe5e5;
|
||
--brand-red-200: #ffcccc;
|
||
--brand-red-300: #ffb2b2;
|
||
--brand-red-400: #ff9999;
|
||
--brand-red-500: #ff8080;
|
||
--brand-red-600: #ff6464;
|
||
--brand-red-700: #e63737;
|
||
--brand-red-800: #cb1010;
|
||
--brand-red-900: #8f0505;
|
||
--brand-red-1000: #4d0000;
|
||
--brand-yellow-100: #fff6e5;
|
||
--brand-yellow-200: #ffeccc;
|
||
--brand-yellow-300: #ffe3b2;
|
||
--brand-yellow-400: #ffda99;
|
||
--brand-yellow-500: #ffd080;
|
||
--brand-yellow-600: #ffc864;
|
||
--brand-yellow-700: #e6a637;
|
||
--brand-yellow-800: #cb8710;
|
||
--brand-yellow-900: #8f5c05;
|
||
--brand-yellow-1000: #4d3000;
|
||
--brand-blue-grey-100: #f1eff4;
|
||
--brand-blue-grey-200: #e0e1e6;
|
||
--brand-blue-grey-300: #cfd3d8;
|
||
--brand-blue-grey-400: #bfc5ca;
|
||
--brand-blue-grey-500: #b0b5ba;
|
||
--brand-blue-grey-600: #a0a6ab;
|
||
--brand-blue-grey-700: #80898e;
|
||
--brand-blue-grey-800: #5e696e;
|
||
--brand-blue-grey-900: #404a4f;
|
||
--brand-blue-grey-1000: #21262b;
|
||
--brand-green-grey-100: #f1f4f4;
|
||
--brand-green-grey-200: #e0e6e6;
|
||
--brand-green-grey-300: #cfd8d8;
|
||
--brand-green-grey-400: #bfcaca;
|
||
--brand-green-grey-500: #b0baba;
|
||
--brand-green-grey-600: #a0abab;
|
||
--brand-green-grey-700: #808e8e;
|
||
--brand-green-grey-800: #5e6e6e;
|
||
--brand-green-grey-900: #404f4f;
|
||
--brand-green-grey-1000: #212b2b;
|
||
--brand-neutral-grey-100: #f2f2f2;
|
||
--brand-neutral-grey-200: #e3e3e3;
|
||
--brand-neutral-grey-300: #d6d6d6;
|
||
--brand-neutral-grey-400: #c7c7c7;
|
||
--brand-neutral-grey-500: #bababa;
|
||
--brand-neutral-grey-600: #ababab;
|
||
--brand-neutral-grey-700: #8a8a8a;
|
||
--brand-neutral-grey-800: #686868;
|
||
--brand-neutral-grey-900: #474747;
|
||
--brand-neutral-grey-1000: #262626;
|
||
--brand-brand-50: #f2f7ff;
|
||
--brand-brand-100: #e5eaff;
|
||
--brand-brand-200: #cfd8ff;
|
||
--brand-brand-300: #aab7ff;
|
||
--brand-brand-400: #8894ff;
|
||
--brand-brand-500: #6a6fff;
|
||
--brand-brand-600: #4b3fe3;
|
||
--brand-brand-700: #3f31c6;
|
||
--brand-brand-800: #2c2290;
|
||
--brand-brand-900: #1a1759;
|
||
--brand-brand-950: #010109;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
--brand-brand-grey-50: #fafafa;
|
||
--brand-brand-grey-100: #f5f5f5;
|
||
--brand-brand-grey-200: #e5e5e5;
|
||
--brand-brand-grey-300: #d4d4d4;
|
||
--brand-brand-grey-400: #a1a1a1;
|
||
--brand-brand-grey-500: #737373;
|
||
--brand-brand-grey-600: #525252;
|
||
--brand-brand-grey-700: #404040;
|
||
--brand-brand-grey-800: #262626;
|
||
--brand-brand-grey-900: #171717;
|
||
--brand-brand-grey-950: #0a0a0a;
|
||
|
||
--body-body-xs: 10px/1.5 var(--font-family-default);
|
||
--body-body-sm: 11px/1.5 var(--font-family-default);
|
||
--body-body-sm-strong: 600 11px/1.5 var(--font-family-default);
|
||
--body-body-md: 12px/1.5 var(--font-family-default);
|
||
--body-body-md-strong: 600 12px/1.5 var(--font-family-default);
|
||
--body-body-base: 14px/1.5 var(--font-family-default);
|
||
--body-body-base-strong: 600 14px/1.5 var(--font-family-default);
|
||
--heading-heading-3xs: 600 10px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xs: 600 11px/1.4 var(--font-family-heading);
|
||
--heading-heading-xs: 600 12px/1.4 var(--font-family-heading);
|
||
--heading-heading-sm: 600 13px/1.4 var(--font-family-heading);
|
||
--heading-heading-md: 600 14px/1.4 var(--font-family-heading);
|
||
--heading-heading-lg: 600 16px/1.4 var(--font-family-heading);
|
||
--heading-heading-xl: 600 20px/1.4 var(--font-family-heading);
|
||
--heading-heading-2xl: 600 24px/1.4 var(--font-family-heading);
|
||
--heading-heading-3xl: 600 32px/1.4 var(--font-family-heading);
|
||
|
||
--bg-bg-overlay-l0: rgba(176, 192, 244, 0.03);
|
||
--bg-primary-item: rgba(176, 192, 244, 0.09);
|
||
--bg-primary-item-hover: rgba(176, 192, 244, 0.13);
|
||
--border-primary-item: rgba(176, 192, 244, 0.06);
|
||
--border-primary-item-hover: rgba(176, 192, 244, 0.1);
|
||
/* 首页输入框边框颜色(纯色,用于内凹圆弧等需要精确边框的场景) */
|
||
--homepage-input-border-color: #343538;
|
||
|
||
--user-message-bg-solid: #1D352A;
|
||
--user-message-bg-solid-transparent: rgba(29, 53, 42, 0);
|
||
--user-message-bg-solid-sub: #2B2A38;
|
||
--user-message-bg-solid-sub-transparent: rgba(43, 42, 56, 0);
|
||
--sheet-text-color: #ffffff;
|
||
--slash-mention-bg: rgba(63, 133, 255, 0.15);
|
||
--builtin-slash-mention-bg: rgba(149, 112, 255, 0.15);
|
||
|
||
--gradient-golden: linear-gradient(180deg, #DAB444 0%, #FFEA8E 100%);
|
||
--special-bggoldoverlay: rgba(139, 128, 65, 0.12);
|
||
--query-tag-bg-grey: rgba(116, 126, 148, 0.18);
|
||
|
||
--bg-bg-brand-old: #32f08c;
|
||
--gradient-brand: linear-gradient(90deg, #3ee1a3 0%, #32f08c 36%, #60f2bd 71.63%, #a0fde7 100%);
|
||
}
|
||
</style><style data-trae-edit-ui="true" id="trae-previewer-tools-styles">:root,
|
||
[data-trae-theme='dark'] {
|
||
--trae-bg-base-default: #171717;
|
||
--trae-bg-menu: #222427;
|
||
--trae-bg-overlay-l1: rgba(255, 255, 255, 0.04);
|
||
--trae-bg-overlay-l2: rgba(255, 255, 255, 0.08);
|
||
--trae-bg-overlay-l3: rgba(255, 255, 255, 0.12);
|
||
--trae-bg-overlay-l4: rgba(255, 255, 255, 0.16);
|
||
--trae-bg-invert: #f5f9fe;
|
||
--trae-bg-invert-hover: #e8ecf0;
|
||
--trae-bg-invert-active: #dce0e4;
|
||
--trae-bg-invert-disabled: rgba(224, 226, 242, 0.12);
|
||
--trae-border-l1: #e0e2f217;
|
||
--trae-border-l2: rgba(255, 255, 255, 0.12);
|
||
--trae-border-l3: rgba(255, 255, 255, 0.08);
|
||
--trae-border-neutral-l3: rgba(229, 229, 229, 0.20);
|
||
--trae-border-brand: #6a6fff;
|
||
--trae-text-default: #f5f9fe;
|
||
--trae-text-default-hover: #f5f9fe;
|
||
--trae-text-default-active: #f5f9fe;
|
||
--trae-text-secondary: rgba(245, 249, 254, 0.5);
|
||
--trae-text-tertiary: rgba(245, 249, 254, 0.4);
|
||
--trae-text-disabled: #666b75;
|
||
--trae-text-onaccent: #222427;
|
||
--trae-icon-default: #f5f9fe;
|
||
--trae-icon-secondary: rgba(245, 249, 254, 0.5);
|
||
--trae-icon-brand: #6a6fff;
|
||
--trae-icon-onaccent: #222427;
|
||
--trae-status-success: #22c55e;
|
||
--trae-status-primary: #3b82f6;
|
||
--trae-status-primary-default: #387bff;
|
||
--trae-status-primary-surface-l1: rgba(53, 121, 255, 0.18);
|
||
--trae-status-success-default: #33c192;
|
||
--trae-status-success-surface-l1: rgba(0, 165, 110, 0.18);
|
||
--trae-status-error-default: #f65a5a;
|
||
--trae-status-error-surface-l1: rgba(246, 70, 70, 0.18);
|
||
--trae-annotation-marker-bg: #4b3fe3;
|
||
--trae-annotation-marker-text: #ffffff;
|
||
--trae-annotation-region-border: var(--trae-status-primary-default);
|
||
--trae-annotation-rect-border: var(--trae-status-error-default);
|
||
--trae-annotation-arrow-anchor-bg: var(--trae-status-primary-default);
|
||
--trae-panel-shadow: 0px 6px 24px -1px rgba(0, 0, 0, 0.16);
|
||
--trae-floating-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.2);
|
||
--trae-shadow-elevation-50: 0 1px 2px -1px rgba(0, 0, 0, 0.45);
|
||
--trae-tab-active-shadow: 0px 1px 2px -1px rgba(0, 0, 0, 0.16);
|
||
}
|
||
|
||
[data-trae-theme='light'] {
|
||
--trae-bg-base-default: #fafafa;
|
||
--trae-bg-menu: #ffffff;
|
||
--trae-bg-overlay-l1: rgba(0, 0, 0, 0.04);
|
||
--trae-bg-overlay-l2: rgba(0, 0, 0, 0.06);
|
||
--trae-bg-overlay-l3: rgba(0, 0, 0, 0.08);
|
||
--trae-bg-overlay-l4: rgba(0, 0, 0, 0.12);
|
||
--trae-bg-invert: #1f2328;
|
||
--trae-bg-invert-hover: #32383f;
|
||
--trae-bg-invert-active: #444d56;
|
||
--trae-bg-invert-disabled: rgba(115, 115, 115, 0.20);
|
||
--trae-border-l1: rgba(0, 0, 0, 0.1);
|
||
--trae-border-l2: rgba(0, 0, 0, 0.12);
|
||
--trae-border-l3: rgba(0, 0, 0, 0.08);
|
||
--trae-border-neutral-l3: rgba(115, 115, 115, 0.36);
|
||
--trae-border-brand: #4b3fe3;
|
||
--trae-text-default: #1f2328;
|
||
--trae-text-default-hover: #111214;
|
||
--trae-text-default-active: #111214;
|
||
--trae-text-secondary: rgba(31, 35, 40, 0.5);
|
||
--trae-text-tertiary: rgba(31, 35, 40, 0.4);
|
||
--trae-text-disabled: #a1a1a1;
|
||
--trae-text-onaccent: #ffffff;
|
||
--trae-icon-default: #1f2328;
|
||
--trae-icon-secondary: rgba(31, 35, 40, 0.5);
|
||
--trae-icon-brand: #4b3fe3;
|
||
--trae-icon-onaccent: #ffffff;
|
||
--trae-status-success: #22c55e;
|
||
--trae-status-primary: #3b82f6;
|
||
--trae-status-primary-default: #2f74ff;
|
||
--trae-status-primary-surface-l1: rgba(47, 116, 255, 0.12);
|
||
--trae-status-success-default: #15a877;
|
||
--trae-status-success-surface-l1: rgba(64, 176, 139, 0.12);
|
||
--trae-status-error-default: #e8463a;
|
||
--trae-status-error-surface-l1: rgba(232, 70, 58, 0.12);
|
||
--trae-annotation-marker-bg: #4b3fe3;
|
||
--trae-annotation-marker-text: #ffffff;
|
||
--trae-annotation-region-border: var(--trae-status-primary-default);
|
||
--trae-annotation-rect-border: var(--trae-status-error-default);
|
||
--trae-annotation-arrow-anchor-bg: var(--trae-status-primary-default);
|
||
--trae-panel-shadow: 0px 6px 24px -1px rgba(24, 24, 24, 0.06);
|
||
--trae-floating-shadow: 0px 2px 8px 0px rgba(24, 24, 24, 0.2);
|
||
--trae-shadow-elevation-50: 0 1px 2px -1px rgba(24, 24, 24, 0.08);
|
||
--trae-tab-active-shadow: 0px 1px 2px -1px rgba(24, 24, 24, 0.08);
|
||
}
|
||
|
||
@keyframes trae-spin {
|
||
to {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
|
||
.trae-edit-mode-active body *:not([data-trae-edit-ui]):not([data-trae-edit-ui] *) {
|
||
transition: none !important;
|
||
animation-play-state: paused !important;
|
||
}
|
||
|
||
.trae-browser-inspect-overlay {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
/* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- 独立注入 CSS,无法访问 :root 变量 */
|
||
z-index: 1400; /* z-layer: fullscreen (1400) */
|
||
pointer-events: auto;
|
||
background: transparent;
|
||
}
|
||
|
||
.trae-browser-inspect-highlight-box {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
/* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- 独立注入 CSS,无法访问 :root 变量 */
|
||
z-index: 1401; /* above overlay */
|
||
display: none;
|
||
}
|
||
|
||
.trae-browser-inspect-highlight-tag {
|
||
position: absolute;
|
||
left: 0px;
|
||
top: 0px;
|
||
height: 18px;
|
||
padding: 0 6px;
|
||
box-sizing: border-box;
|
||
border-radius: 4px;
|
||
background-color: var(--trae-status-success-default);
|
||
color: var(--trae-text-onaccent);
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
display: none;
|
||
align-items: center;
|
||
/* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- 独立注入 CSS,无法访问 :root 变量 */
|
||
z-index: 1402; /* above highlight-box */
|
||
}
|
||
|
||
.trae-browser-inspect-highlight-box-show {
|
||
display: flex;
|
||
}
|
||
|
||
.trae-browser-inspect-highlight-tag.trae-browser-inspect-highlight-box-show {
|
||
display: none;
|
||
}
|
||
|
||
.trae-browser-inspect-select-button.trae-browser-inspect-highlight-box-show {
|
||
display: block !important;
|
||
}
|
||
|
||
.trae-browser-inspect-select-button {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
display: none;
|
||
/* stylelint-disable-next-line scale-unlimited/declaration-strict-value -- 独立注入 CSS,无法访问 :root 变量 */
|
||
z-index: 1402; /* above overlay, must receive pointer events */
|
||
}
|
||
|
||
.trae-browser-inspect-select-highlight-box {
|
||
background: transparent !important;
|
||
}
|
||
|
||
.trae-browser-inspect-select-highlight-box .trae-browser-inspect-highlight-tag {
|
||
background-color: var(--trae-status-success-default);
|
||
}
|
||
|
||
.trae-add-to-chat-card {
|
||
display: block;
|
||
overflow: hidden;
|
||
background: var(--trae-bg-menu);
|
||
border: 1px solid var(--trae-border-l1);
|
||
border-radius: 8px;
|
||
box-shadow: var(--trae-floating-shadow);
|
||
transition:
|
||
width 0.25s cubic-bezier(0.4, 0, 0.2, 1),
|
||
height 0.25s cubic-bezier(0.4, 0, 0.2, 1);
|
||
}
|
||
|
||
.trae-add-to-chat-content {
|
||
position: relative;
|
||
width: max-content;
|
||
}
|
||
|
||
.trae-fade-exit {
|
||
opacity: 0;
|
||
transition: opacity 0.15s ease-out;
|
||
}
|
||
|
||
.trae-fade-enter {
|
||
opacity: 1;
|
||
transition: opacity 0.2s ease-in;
|
||
}
|
||
|
||
.trae-buttons-view {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0;
|
||
padding: 4px;
|
||
background: transparent;
|
||
}
|
||
|
||
.trae-action-button {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 4px;
|
||
padding: 4px 8px;
|
||
background: transparent;
|
||
border: none;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
transform: none !important;
|
||
transition: none !important;
|
||
animation: none !important;
|
||
}
|
||
|
||
.trae-action-button:hover {
|
||
background: var(--trae-bg-overlay-l2);
|
||
}
|
||
|
||
.trae-action-button:active {
|
||
background: var(--trae-bg-overlay-l3);
|
||
}
|
||
|
||
.trae-action-button:focus-visible {
|
||
outline: 2px solid var(--trae-status-primary);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.trae-action-button-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--trae-icon-default);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trae-action-button-title {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
color: var(--trae-text-default);
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.trae-edit-toolbar-button-active {
|
||
background: var(--trae-status-primary-surface-l1) !important;
|
||
color: var(--trae-status-primary-default) !important;
|
||
}
|
||
|
||
.trae-edit-toolbar button[data-action='alignment-dropdown']:hover,
|
||
.trae-edit-toolbar button[data-action='text-align-dropdown']:hover,
|
||
.trae-edit-toolbar button[data-action='font-decrease']:hover,
|
||
.trae-edit-toolbar button[data-action='font-increase']:hover,
|
||
.trae-edit-toolbar button[data-action^='align-']:hover {
|
||
border-radius: 8px;
|
||
background: var(--bg-bg-overlay-l1, rgba(115, 115, 115, 0.08)) !important;
|
||
}
|
||
|
||
.trae-edit-toolbar button[data-action='alignment-dropdown']:active,
|
||
.trae-edit-toolbar button[data-action='text-align-dropdown']:active,
|
||
.trae-edit-toolbar button[data-action='font-decrease']:active,
|
||
.trae-edit-toolbar button[data-action='font-increase']:active,
|
||
.trae-edit-toolbar button[data-action^='align-']:active {
|
||
border-radius: 8px;
|
||
background: var(--bg-bg-overlay-l2, rgba(115, 115, 115, 0.12)) !important;
|
||
}
|
||
|
||
.trae-comment-input {
|
||
background: transparent;
|
||
color: var(--trae-text-default);
|
||
caret-color: var(--trae-text-default);
|
||
}
|
||
|
||
.trae-comment-input::placeholder {
|
||
color: var(--trae-text-tertiary);
|
||
}
|
||
|
||
.trae-edit-panel [data-trae-tooltip] {
|
||
position: relative;
|
||
}
|
||
|
||
.trae-edit-panel [data-trae-tooltip]::after {
|
||
content: attr(data-trae-tooltip);
|
||
position: absolute;
|
||
left: 50%;
|
||
bottom: calc(100% + 8px);
|
||
z-index: var(--z-max, 9999);
|
||
padding: 6px 10px;
|
||
border-radius: 6px;
|
||
background: var(--bg-bg-invert, var(--trae-bg-invert));
|
||
color: var(--text-text-onaccent, var(--trae-text-onaccent));
|
||
box-shadow: var(--trae-floating-shadow);
|
||
font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'PingFang SC', sans-serif;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
letter-spacing: 0.039px;
|
||
white-space: nowrap;
|
||
pointer-events: none;
|
||
box-sizing: border-box;
|
||
opacity: 0;
|
||
transform: translateX(-50%);
|
||
visibility: hidden;
|
||
}
|
||
|
||
.trae-edit-panel [data-trae-tooltip]::before {
|
||
content: '';
|
||
position: absolute;
|
||
left: 50%;
|
||
bottom: calc(100% + 5px);
|
||
z-index: var(--z-max, 9999);
|
||
width: 8px;
|
||
height: 4px;
|
||
background: var(--bg-bg-invert, var(--trae-bg-invert));
|
||
clip-path: polygon(0 0, 100% 0, 50% 100%);
|
||
transform: translateX(-50%);
|
||
pointer-events: none;
|
||
opacity: 0;
|
||
visibility: hidden;
|
||
}
|
||
|
||
.trae-edit-panel [data-trae-tooltip]:hover::after,
|
||
.trae-edit-panel [data-trae-tooltip]:focus-visible::after,
|
||
.trae-edit-panel [data-trae-tooltip]:hover::before,
|
||
.trae-edit-panel [data-trae-tooltip]:focus-visible::before {
|
||
opacity: 1;
|
||
visibility: visible;
|
||
}
|
||
|
||
.trae-comment-btn {
|
||
justify-content: center;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease;
|
||
}
|
||
|
||
.trae-comment-btn:disabled {
|
||
cursor: not-allowed;
|
||
}
|
||
|
||
.trae-comment-btn:focus-visible {
|
||
outline: 2px solid var(--trae-status-primary);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.trae-comment-btn-primary {
|
||
background: var(--trae-bg-invert);
|
||
color: var(--trae-text-onaccent);
|
||
}
|
||
|
||
.trae-comment-btn-primary:hover:not(:disabled) {
|
||
background: var(--trae-bg-invert-hover);
|
||
}
|
||
|
||
.trae-comment-btn-primary:active:not(:disabled) {
|
||
background: var(--trae-bg-invert-active);
|
||
}
|
||
|
||
.trae-comment-btn-primary:disabled {
|
||
background: var(--trae-bg-invert-disabled);
|
||
color: var(--trae-text-disabled);
|
||
}
|
||
|
||
.trae-comment-btn-secondary {
|
||
background: var(--trae-bg-overlay-l2);
|
||
color: var(--trae-text-default);
|
||
}
|
||
|
||
.trae-comment-btn-secondary:hover:not(:disabled) {
|
||
background: var(--trae-bg-overlay-l3);
|
||
}
|
||
|
||
.trae-comment-btn-secondary:active:not(:disabled) {
|
||
background: var(--trae-bg-overlay-l4);
|
||
}
|
||
|
||
.trae-comment-btn-secondary:disabled {
|
||
background: var(--trae-bg-overlay-l2);
|
||
color: var(--trae-text-disabled);
|
||
}
|
||
|
||
.trae-comment-btn-text {
|
||
background: transparent;
|
||
color: var(--trae-text-default);
|
||
}
|
||
|
||
.trae-comment-btn-text:hover:not(:disabled) {
|
||
border-radius: 8px;
|
||
background: var(--bg-bg-overlay-l1, var(--trae-bg-overlay-l1));
|
||
color: var(--trae-text-default-hover);
|
||
}
|
||
|
||
.trae-comment-btn-text:active:not(:disabled) {
|
||
border-radius: 8px;
|
||
background: var(--trae-bg-overlay-l2);
|
||
color: var(--trae-text-default-active);
|
||
}
|
||
|
||
.trae-comment-btn-text:disabled {
|
||
background: transparent;
|
||
color: var(--trae-text-disabled);
|
||
}
|
||
|
||
.trae-marking-btn {
|
||
justify-content: center;
|
||
}
|
||
|
||
.trae-marking-btn:hover:not(:disabled) {
|
||
background: var(--trae-bg-overlay-l1) !important;
|
||
}
|
||
|
||
.trae-marking-btn:active:not(:disabled) {
|
||
background: var(--trae-bg-overlay-l2) !important;
|
||
}
|
||
|
||
.trae-marking-btn-active {
|
||
background: var(--trae-status-primary-surface-l1) !important;
|
||
color: var(--trae-status-primary-default) !important;
|
||
}
|
||
|
||
.trae-marking-btn:disabled {
|
||
color: var(--trae-text-disabled) !important;
|
||
cursor: not-allowed !important;
|
||
}
|
||
|
||
.trae-action-button-shortcut {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2px;
|
||
color: var(--trae-icon-secondary);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trae-shortcut-container {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 2px;
|
||
}
|
||
|
||
.trae-shortcut-key {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 12px;
|
||
color: var(--trae-icon-secondary);
|
||
}
|
||
|
||
.trae-add-to-chat-divider {
|
||
width: 2px;
|
||
height: 12px;
|
||
padding: 0 6px;
|
||
box-sizing: content-box;
|
||
background-clip: content-box;
|
||
background-color: var(--trae-border-l2);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trae-editor-view {
|
||
display: flex;
|
||
flex-direction: column;
|
||
width: 320px;
|
||
padding: 8px;
|
||
background: transparent;
|
||
}
|
||
|
||
.trae-editor-text-container {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 8px;
|
||
background: var(--trae-bg-overlay-l1);
|
||
border: 1px solid var(--trae-border-l3);
|
||
border-radius: 4px;
|
||
gap: 8px;
|
||
}
|
||
|
||
.trae-editor-textarea {
|
||
flex: 1;
|
||
padding: 0 2px;
|
||
border: none;
|
||
background: transparent;
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 13px;
|
||
font-weight: 400;
|
||
line-height: 20px;
|
||
color: var(--trae-text-default);
|
||
resize: none;
|
||
outline: none;
|
||
overflow-y: auto;
|
||
max-height: 140px;
|
||
}
|
||
|
||
.trae-editor-textarea::placeholder {
|
||
color: var(--trae-text-tertiary);
|
||
}
|
||
|
||
.trae-editor-action-bar {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
gap: 4px;
|
||
max-height: 0;
|
||
opacity: 0;
|
||
overflow: hidden;
|
||
transition:
|
||
max-height 0.2s ease-out,
|
||
opacity 0.2s ease-out,
|
||
margin-top 0.2s ease-out;
|
||
}
|
||
|
||
.trae-editor-action-bar-visible {
|
||
max-height: 32px;
|
||
opacity: 1;
|
||
margin-top: 8px;
|
||
}
|
||
|
||
.trae-editor-cancel-button {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
height: 24px;
|
||
padding: 0 4px;
|
||
background: var(--trae-bg-overlay-l2);
|
||
border: none;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease;
|
||
}
|
||
|
||
.trae-editor-cancel-button:hover {
|
||
background: var(--trae-bg-overlay-l3);
|
||
}
|
||
|
||
.trae-editor-cancel-button:active {
|
||
background: var(--trae-bg-overlay-l3);
|
||
}
|
||
|
||
.trae-editor-cancel-button:focus-visible {
|
||
outline: 2px solid var(--trae-status-primary);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.trae-editor-cancel-text {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
color: var(--trae-text-default);
|
||
white-space: nowrap;
|
||
padding: 0 4px;
|
||
}
|
||
|
||
.trae-editor-submit-button {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
height: 24px;
|
||
padding: 0 8px;
|
||
background: var(--trae-bg-invert);
|
||
border: none;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease;
|
||
}
|
||
|
||
.trae-editor-submit-button:hover {
|
||
background: var(--trae-bg-invert-hover);
|
||
}
|
||
|
||
.trae-editor-submit-button:active {
|
||
background: var(--trae-bg-invert-active);
|
||
}
|
||
|
||
.trae-editor-submit-button:focus-visible {
|
||
outline: 2px solid var(--trae-status-primary);
|
||
outline-offset: 1px;
|
||
}
|
||
|
||
.trae-editor-submit-text {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 11px;
|
||
font-weight: 500;
|
||
line-height: 16px;
|
||
color: var(--trae-text-onaccent);
|
||
white-space: nowrap;
|
||
padding: 0 4px;
|
||
}
|
||
|
||
.trae-editor-submit-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 12px;
|
||
height: 12px;
|
||
color: var(--trae-icon-onaccent);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trae-success-view {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 6px;
|
||
padding: 0 12px;
|
||
height: 32px;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.trae-success-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 16px;
|
||
height: 16px;
|
||
color: var(--trae-status-success);
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trae-success-text {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 18px;
|
||
color: var(--trae-text-default);
|
||
user-select: none;
|
||
}
|
||
</style></head>
|
||
<body>
|
||
<div id="panel">
|
||
<div class="ctrl">
|
||
<label>碎片数量</label>
|
||
<div class="row"><input type="range" id="f_count" min="30" max="260" step="1" value="120"><span class="val" id="v_count">120</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>棱镜分割份数</label>
|
||
<div class="row"><input type="range" id="f_seg" min="3" max="12" step="1" value="6"><span class="val" id="v_seg">6</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>桶宽 (视窗孔径)</label>
|
||
<div class="row"><input type="range" id="f_barrel" min="0.40" max="1.00" step="0.02" value="1.00"><span class="val" id="v_barrel">1</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>碎片最小倍率</label>
|
||
<div class="row"><input type="range" id="f_min" min="0.20" max="1.20" step="0.05" value="0.50"><span class="val" id="v_min">0.5</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>碎片最大倍率</label>
|
||
<div class="row"><input type="range" id="f_max" min="1.00" max="4.00" step="0.05" value="3.00"><span class="val" id="v_max">1.95</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>重力强度</label>
|
||
<div class="row"><input type="range" id="f_g" min="0.00" max="0.30" step="0.01" value="0.07"><span class="val" id="v_g">0.07</span></div>
|
||
</div>
|
||
<div class="ctrl">
|
||
<label>静摩擦系数</label>
|
||
<div class="row"><input type="range" id="f_f" min="0.02" max="0.20" step="0.01" value="0.11"><span class="val" id="v_f">0.11</span></div>
|
||
</div>
|
||
<div class="ctrl check"><input type="checkbox" id="f_gon"><label for="f_gon">启用重力</label></div>
|
||
<button class="btn primary" id="b_apply">应用设置</button>
|
||
<button class="btn" id="b_shake">手动摇晃万花筒</button>
|
||
</div>
|
||
|
||
<div id="stage"><div id="shell"><canvas id="cv" width="518" height="518" style="width: 414px; height: 414px;"></canvas></div></div>
|
||
<div id="tip">按住鼠标拖动旋转镜筒|双击画面摇晃万花筒</div>
|
||
<div class="toast" id="toast">已应用设置,重新生成碎片</div>
|
||
|
||
<script>
|
||
"use strict";
|
||
/* ============================================================
|
||
老式物理万花筒 —— 纯前端单文件实现
|
||
- 原始碎片层做物理;镜像靠矩阵变换复制绘制
|
||
- 重力方向跟随镜筒整体旋转角度
|
||
- 5 类碎片按硬性概率配比生成
|
||
============================================================ */
|
||
|
||
const cv = document.getElementById('cv');
|
||
const ctx = cv.getContext('2d');
|
||
|
||
/* ---------- 当前生效配置(点击"应用设置"后写入) ---------- */
|
||
let cfg = {
|
||
count:120, segments:6, barrel:1.00,
|
||
minScale:0.50, maxScale:3.00,
|
||
gravity:0.07, friction:0.11, gravityOn:false
|
||
};
|
||
|
||
let pieces = []; // 原始碎片数组(仅物理对象)
|
||
let tubeAngle = 0; // 镜筒整体旋转角度
|
||
let canvasR = 300; // 画布圆形半径(逻辑像素)
|
||
let viewR = 300; // 视窗物理半径 = canvasR * barrel
|
||
let baseSize = 15; // 碎片基准尺寸 = viewR * 0.05
|
||
let cx = 0, cy = 0; // 画布中心
|
||
let dpr = 1;
|
||
let shakeTimer = 0; // 摇晃持续帧数
|
||
|
||
/* 复古彩色色池 */
|
||
const PALETTE = [
|
||
'#c0392b','#d35400','#e08b3c','#c9a227','#a4a02a','#7d8c3c',
|
||
'#16a085','#1f7a8c','#2f6da3','#8e5db7','#a0467a','#b5651d',
|
||
'#cd853f','#9c4a2a'
|
||
];
|
||
const rnd = (a,b)=>a+Math.random()*(b-a);
|
||
const rndi = (a,b)=>Math.floor(rnd(a,b+1));
|
||
const pick = a => a[Math.floor(Math.random()*a.length)];
|
||
|
||
/* ---------- 读取 UI 控件值 ---------- */
|
||
function readUI(){
|
||
return {
|
||
count: +document.getElementById('f_count').value,
|
||
segments: +document.getElementById('f_seg').value,
|
||
barrel: +document.getElementById('f_barrel').value,
|
||
minScale: +document.getElementById('f_min').value,
|
||
maxScale: +document.getElementById('f_max').value,
|
||
gravity: +document.getElementById('f_g').value,
|
||
friction: +document.getElementById('f_f').value,
|
||
gravityOn: document.getElementById('f_gon').checked
|
||
};
|
||
}
|
||
|
||
/* ============================================================
|
||
二、碎片形状生成(5 类,硬性概率配比)
|
||
返回归一化形状描述(半径约 1,绘制时乘 baseSize*scale)
|
||
============================================================ */
|
||
function genShape(){
|
||
const r = Math.random();
|
||
if(r < 0.50) return genPoly(); // 50% 不规则多角
|
||
if(r < 0.75) return genEllipse(); // 25% 椭圆/扁片
|
||
if(r < 0.85) return genNearCircle(); // 10% 近圆轻微变形
|
||
if(r < 0.95) return genMixedDrop(); // 10% 水滴/三角/梯形
|
||
return genPrim(); // 5% 标准几何
|
||
}
|
||
|
||
// 50%:不规则多角碎片(3-7 边,顶点角度带随机扰动)
|
||
function genPoly(){
|
||
const n = rndi(3,7);
|
||
const pts = [];
|
||
for(let i=0;i<n;i++){
|
||
const a = i/n*Math.PI*2 + rnd(-0.18,0.18);
|
||
const rr = rnd(0.62,1.0);
|
||
pts.push([Math.cos(a)*rr, Math.sin(a)*rr]);
|
||
}
|
||
return {type:'poly', pts};
|
||
}
|
||
|
||
// 25%:椭圆/扁片(长短轴差距明显,旋转角由 piece.angle 提供)
|
||
function genEllipse(){
|
||
return {type:'ellipse', rx:rnd(0.55,1.0), ry:rnd(0.16,0.42)};
|
||
}
|
||
|
||
// 10%:近圆、轻微变形圆(8 顶点,半径小幅扰动,非完美正圆)
|
||
function genNearCircle(){
|
||
const pts = [];
|
||
for(let i=0;i<8;i++){
|
||
const a = i/8*Math.PI*2;
|
||
const rr = rnd(0.82,1.0);
|
||
pts.push([Math.cos(a)*rr, Math.sin(a)*rr]);
|
||
}
|
||
return {type:'poly', pts};
|
||
}
|
||
|
||
// 10%:水滴/圆角不规则片状/三角形/梯形(内部三子形态随机)
|
||
function genMixedDrop(){
|
||
const k = Math.floor(Math.random()*3);
|
||
if(k===0){
|
||
// 水滴:上尖下圆
|
||
const pts=[]; const n=10;
|
||
for(let i=0;i<n;i++){
|
||
const t = i/n*Math.PI*2;
|
||
const rr = (0.55 + 0.45*Math.cos(t)) * (1 - 0.28*Math.sin(t));
|
||
pts.push([Math.sin(t)*0.62*rr, -Math.cos(t)*rr]);
|
||
}
|
||
return {type:'poly', pts};
|
||
}
|
||
if(k===1){
|
||
// 简易三角形
|
||
return {type:'poly', pts:[[0,-1],[rnd(0.7,1.0),rnd(0.5,0.8)],[-rnd(0.7,1.0),rnd(0.5,0.8)]]};
|
||
}
|
||
// 简易梯形
|
||
const w1=rnd(0.4,0.6), w2=rnd(0.8,1.0);
|
||
return {type:'poly', pts:[[-w1,-0.6],[w1,-0.6],[w2,0.6],[-w2,0.6]]};
|
||
}
|
||
|
||
// 5%:标准几何图形(正三角形/完美正圆/正方形 三选一均等)
|
||
function genPrim(){
|
||
const k = Math.floor(Math.random()*3);
|
||
if(k===0){
|
||
const pts=[];
|
||
for(let i=0;i<3;i++){const a=i/3*Math.PI*2-Math.PI/2; pts.push([Math.cos(a),Math.sin(a)]);}
|
||
return {type:'poly', pts};
|
||
}
|
||
if(k===1) return {type:'circle', r:1};
|
||
return {type:'poly', pts:[[-0.82,-0.82],[0.82,-0.82],[0.82,0.82],[-0.82,0.82]]};
|
||
}
|
||
|
||
// 形状包围半径(归一化),用于边界与休眠判定
|
||
function shapeRadius(sh){
|
||
if(sh.type==='ellipse') return Math.max(sh.rx, sh.ry);
|
||
if(sh.type==='circle') return sh.r;
|
||
let m=0; for(const p of sh.pts){const h=Math.hypot(p[0],p[1]); if(h>m)m=h;} return m;
|
||
}
|
||
|
||
/* 重新随机生成整套碎片 */
|
||
function resetPieces(){
|
||
pieces = [];
|
||
for(let i=0;i<cfg.count;i++){
|
||
const scale = rnd(cfg.minScale, cfg.maxScale);
|
||
const sh = genShape();
|
||
const ang = rnd(0, Math.PI*2);
|
||
const rad = Math.sqrt(Math.random()) * (viewR * 0.78); // 圆内均匀分布
|
||
pieces.push({
|
||
sh,
|
||
x: Math.cos(ang)*rad, y: Math.sin(ang)*rad,
|
||
angle: rnd(0, Math.PI*2),
|
||
scale, color: pick(PALETTE), alpha: rnd(0.62, 0.94),
|
||
vx: rnd(-1,1), vy: rnd(-1,1), va: rnd(-0.05,0.05),
|
||
mass: scale, sleep:false
|
||
});
|
||
}
|
||
}
|
||
|
||
function wakeAll(){ for(const p of pieces) p.sleep=false; }
|
||
|
||
/* ============================================================
|
||
三、物理引擎(仅对原始碎片层生效)
|
||
============================================================ */
|
||
function update(){
|
||
// 物理在万花筒"局部坐标系"中计算:重力恒向下 (+y)。
|
||
// 绘制时整体旋转 tubeAngle,因此视觉上重力方向随镜筒旋转 —— 即"重力跟随万花筒整体旋转角度"。
|
||
const g = cfg.gravityOn ? cfg.gravity : 0;
|
||
|
||
for(const p of pieces){
|
||
if(p.sleep) continue;
|
||
|
||
// 重力驱动(局部坐标,恒向下)
|
||
p.vy += g;
|
||
|
||
// 动摩擦:速度与角速度持续衰减
|
||
p.vx *= 0.985; p.vy *= 0.985; p.va *= 0.96;
|
||
|
||
// 位置更新
|
||
p.x += p.vx; p.y += p.vy; p.angle += p.va;
|
||
|
||
// 休眠判定:速度 + 重力驱动力 < 静摩擦阈值
|
||
const speed = Math.hypot(p.vx, p.vy);
|
||
let thresh = cfg.friction;
|
||
// 小碎片额外叠加更高静摩擦:大碎片易滑动,小碎片易卡住
|
||
if(p.scale < 1.0) thresh += (1.0 - p.scale) * 0.12;
|
||
if(speed + g < thresh){
|
||
p.vx = 0; p.vy = 0; p.va = 0; p.sleep = true;
|
||
}
|
||
|
||
// 圆形边界:超出推回 + 反弹阻尼
|
||
const rr = shapeRadius(p.sh) * baseSize * p.scale;
|
||
const dist = Math.hypot(p.x, p.y);
|
||
const limit = viewR - rr;
|
||
if(dist > limit && dist > 0){
|
||
const nx = p.x/dist, ny = p.y/dist;
|
||
p.x = nx*limit; p.y = ny*limit;
|
||
const vn = p.vx*nx + p.vy*ny;
|
||
if(vn > 0){ p.vx -= 1.6*vn*nx; p.vy -= 1.6*vn*ny; }
|
||
p.vx *= 0.6; p.vy *= 0.6;
|
||
}
|
||
}
|
||
|
||
// 摇晃持续一段时间:不断施加随机扰动
|
||
if(shakeTimer > 0){
|
||
for(const p of pieces){
|
||
p.vx += rnd(-0.8,0.8); p.vy += rnd(-0.8,0.8); p.va += rnd(-0.08,0.08);
|
||
}
|
||
shakeTimer--;
|
||
}
|
||
}
|
||
|
||
/* 摇晃:给所有碎片随机速度/角速度,清除休眠 */
|
||
function shake(){
|
||
shakeTimer = 50;
|
||
for(const p of pieces){
|
||
p.sleep = false;
|
||
p.vx += rnd(-4,4); p.vy += rnd(-4,4); p.va += rnd(-0.2,0.2);
|
||
}
|
||
}
|
||
|
||
/* ============================================================
|
||
四、绘制与万花筒镜像逻辑
|
||
- 每个扇区 clip + 旋转,奇数扇区 Y 轴翻转(镜像反射)
|
||
- 镜像完全靠矩阵变换复制绘制,不生成实体碎片
|
||
============================================================ */
|
||
function drawShape(sh){
|
||
ctx.beginPath();
|
||
if(sh.type === 'ellipse'){
|
||
ctx.ellipse(0,0, Math.max(0.001,sh.rx), Math.max(0.001,sh.ry), 0, 0, Math.PI*2);
|
||
}else if(sh.type === 'circle'){
|
||
ctx.arc(0,0, Math.max(0.001,sh.r), 0, Math.PI*2);
|
||
}else{
|
||
const pts = sh.pts;
|
||
ctx.moveTo(pts[0][0], pts[0][1]);
|
||
for(let i=1;i<pts.length;i++) ctx.lineTo(pts[i][0], pts[i][1]);
|
||
ctx.closePath();
|
||
}
|
||
ctx.fill();
|
||
// 细黑边增加碎玻璃感
|
||
ctx.strokeStyle = 'rgba(0,0,0,0.28)';
|
||
ctx.lineWidth = 0.06;
|
||
ctx.stroke();
|
||
}
|
||
|
||
// 在当前变换下绘制全部原始碎片(世界坐标,原点为圆心)
|
||
function drawPieces(){
|
||
for(const p of pieces){
|
||
ctx.save();
|
||
ctx.translate(p.x, p.y);
|
||
ctx.rotate(p.angle);
|
||
const s = p.scale * baseSize;
|
||
ctx.scale(s, s);
|
||
ctx.globalAlpha = p.alpha;
|
||
ctx.fillStyle = p.color;
|
||
drawShape(p.sh);
|
||
ctx.restore();
|
||
}
|
||
ctx.globalAlpha = 1;
|
||
}
|
||
|
||
function draw(){
|
||
const W = cx*2;
|
||
// 整体黑色背景(同时充当圆外遮罩,只保留圆形视窗可见)
|
||
ctx.fillStyle = '#000';
|
||
ctx.fillRect(0,0,W,W);
|
||
|
||
ctx.save();
|
||
// 整体旋转镜筒:物理在局部坐标系,绘制时旋转 tubeAngle 还原视觉
|
||
ctx.translate(cx, cy);
|
||
ctx.rotate(tubeAngle);
|
||
|
||
// 圆形视窗 clip(桶宽控制可见孔径)。圆旋转后仍为圆,故 clip 等效
|
||
ctx.beginPath();
|
||
ctx.arc(0, 0, viewR, 0, Math.PI*2);
|
||
ctx.clip();
|
||
|
||
const N = cfg.segments;
|
||
const seg = Math.PI*2 / N;
|
||
|
||
// 按棱镜分割份数做扇形分割,奇数扇区 Y 轴翻转(镜像反射)
|
||
// 镜像完全靠矩阵变换复制绘制,不生成实体碎片对象
|
||
for(let i=0;i<N;i++){
|
||
ctx.save();
|
||
ctx.beginPath();
|
||
ctx.moveTo(0, 0);
|
||
ctx.arc(0, 0, viewR*1.2, i*seg, (i+1)*seg);
|
||
ctx.closePath();
|
||
ctx.clip();
|
||
if(i % 2 === 1) ctx.scale(-1, 1); // 奇数扇区 Y 轴翻转
|
||
drawPieces(); // 绘制全部原始碎片(局部坐标,原点为圆心)
|
||
ctx.restore();
|
||
}
|
||
|
||
// screen 混合的弱模糊叠层,模拟玻璃光晕
|
||
ctx.globalCompositeOperation = 'screen';
|
||
const glow = ctx.createRadialGradient(0, 0, viewR*0.18, 0, 0, viewR);
|
||
glow.addColorStop(0, 'rgba(90,78,52,0.06)');
|
||
glow.addColorStop(0.7, 'rgba(40,32,20,0.03)');
|
||
glow.addColorStop(1, 'rgba(0,0,0,0)');
|
||
ctx.fillStyle = glow;
|
||
ctx.fillRect(-viewR, -viewR, viewR*2, viewR*2);
|
||
ctx.globalCompositeOperation = 'source-over';
|
||
|
||
ctx.restore();
|
||
}
|
||
|
||
/* ============================================================
|
||
主循环
|
||
============================================================ */
|
||
function loop(){ update(); draw(); requestAnimationFrame(loop); }
|
||
|
||
/* ============================================================
|
||
五、交互行为
|
||
============================================================ */
|
||
function clientAngle(clientX, clientY){
|
||
const r = cv.getBoundingClientRect();
|
||
const x = clientX - r.left - r.width/2;
|
||
const y = clientY - r.top - r.height/2;
|
||
return Math.atan2(y, x);
|
||
}
|
||
|
||
let dragging = false, lastAngle = 0;
|
||
cv.addEventListener('mousedown', e=>{
|
||
dragging = true; lastAngle = clientAngle(e.clientX, e.clientY); wakeAll();
|
||
});
|
||
window.addEventListener('mousemove', e=>{
|
||
if(!dragging) return;
|
||
const a = clientAngle(e.clientX, e.clientY);
|
||
let d = a - lastAngle;
|
||
tubeAngle += d; lastAngle = a;
|
||
});
|
||
window.addEventListener('mouseup', ()=> dragging = false);
|
||
cv.addEventListener('dblclick', shake);
|
||
|
||
// 触摸:拖动旋转 + 两次短触摸判定摇晃
|
||
let touchDrag = false, lastTouchAngle = 0, lastTap = 0;
|
||
cv.addEventListener('touchstart', e=>{
|
||
e.preventDefault();
|
||
if(e.touches.length !== 1) return;
|
||
const t = e.touches[0];
|
||
lastTouchAngle = clientAngle(t.clientX, t.clientY);
|
||
touchDrag = true; wakeAll();
|
||
const now = Date.now();
|
||
if(now - lastTap < 300) shake();
|
||
lastTap = now;
|
||
},{passive:false});
|
||
cv.addEventListener('touchmove', e=>{
|
||
e.preventDefault();
|
||
if(!touchDrag || e.touches.length !== 1) return;
|
||
const t = e.touches[0];
|
||
const a = clientAngle(t.clientX, t.clientY);
|
||
tubeAngle += a - lastTouchAngle; lastTouchAngle = a;
|
||
},{passive:false});
|
||
cv.addEventListener('touchend', ()=> touchDrag = false);
|
||
|
||
/* 应用设置:读取全部 UI 值,校验 min/max,重新生成碎片 */
|
||
function applySettings(){
|
||
const u = readUI();
|
||
let mn = u.minScale, mx = u.maxScale;
|
||
if(mn > mx){
|
||
[mn, mx] = [mx, mn];
|
||
toast('最小倍率大于最大倍率,已自动交换');
|
||
}
|
||
cfg = {
|
||
count:u.count, segments:u.segments, barrel:u.barrel,
|
||
minScale:mn, maxScale:mx,
|
||
gravity:u.gravity, friction:u.friction, gravityOn:u.gravityOn
|
||
};
|
||
viewR = canvasR * cfg.barrel;
|
||
baseSize = viewR * 0.05;
|
||
resetPieces();
|
||
toast('已应用设置,重新生成碎片');
|
||
}
|
||
|
||
document.getElementById('b_apply').addEventListener('click', applySettings);
|
||
document.getElementById('b_shake').addEventListener('click', shake);
|
||
|
||
/* 数值标签同步 */
|
||
['count','seg','barrel','min','max','g','f'].forEach(k=>{
|
||
const el = document.getElementById('f_'+k);
|
||
const vl = document.getElementById('v_'+k);
|
||
const sync = ()=> vl.textContent = el.value;
|
||
el.addEventListener('input', sync); sync();
|
||
});
|
||
|
||
/* toast 提示 */
|
||
function toast(msg){
|
||
const t = document.getElementById('toast');
|
||
t.textContent = msg; t.classList.add('show');
|
||
clearTimeout(t._t); t._t = setTimeout(()=> t.classList.remove('show'), 1800);
|
||
}
|
||
|
||
/* ---------- 画布尺寸响应 ---------- */
|
||
function resize(){
|
||
const max = Math.min(window.innerWidth*0.92, window.innerHeight - 240, 620);
|
||
const size = Math.max(280, max);
|
||
dpr = window.devicePixelRatio || 1;
|
||
cv.style.width = size+'px';
|
||
cv.style.height = size+'px';
|
||
cv.width = Math.round(size*dpr);
|
||
cv.height = Math.round(size*dpr);
|
||
ctx.setTransform(dpr,0,0,dpr,0,0);
|
||
canvasR = size/2; cx = canvasR; cy = canvasR;
|
||
viewR = canvasR * cfg.barrel;
|
||
baseSize = viewR * 0.05;
|
||
}
|
||
window.addEventListener('resize', resize);
|
||
|
||
/* ---------- 初始化 ---------- */
|
||
resize();
|
||
resetPieces();
|
||
loop();
|
||
</script>
|
||
|
||
|
||
<div class="light"></div><div data-trae-edit-ui="true"></div></body></html> |