/* ST STUDIO — architectural workspace identity. */
:root {
  --fn-color-brand: #8f6d3f !important;
  --fn-color-brand-hover: #755631 !important;
  --fn-color-brand-soft: #ac8a58 !important;
  --fn-color-brand-light: #eee6d7 !important;
  --fn-color-brand-bg: rgba(143,109,63,.08) !important;
  --fn-bg-page: #f4f2ec !important;
  --fn-accent-primary: #8f6d3f !important;
  --fn-accent-hover: #755631 !important;
  --fn-accent-bg: rgba(143,109,63,.10) !important;
  --fn-accent-border: rgba(143,109,63,.24) !important;
  --fn-bg-primary: #faf9f6 !important;
  --fn-bg-secondary: #f3f1ec !important;
  --fn-text-primary: #202321 !important;
  --fn-border-default: #e2dfd6 !important;
  --background: #faf9f6;
  --foreground: #202321;
  --card: #fffefa;
  --popover: #fffefa;
  --primary: #8f6d3f;
  --primary-foreground: #ffffff;
  --accent: #ede7db;
  --accent-foreground: #332a20;
  --border: #ddd8cc;
  --ring: #b79765;
  --sidebar: #f5f3ed;
}
html.dark, html[data-theme="dark"] {
  --fn-color-brand: #c3a574 !important;
  --fn-color-brand-hover: #d4bb91 !important;
  --fn-color-brand-soft: #c3a574 !important;
  --fn-color-brand-light: #33372f !important;
  --fn-color-brand-bg: rgba(195,165,116,.12) !important;
  --fn-bg-page: #171a19 !important;
  --fn-accent-primary: #c3a574 !important;
  --fn-accent-hover: #d4bb91 !important;
  --fn-accent-bg: rgba(195,165,116,.12) !important;
  --fn-bg-primary: #171a19 !important;
  --fn-bg-secondary: #202422 !important;
  --fn-text-primary: #f0eee7 !important;
  --fn-border-default: #373c37 !important;
  --background: #171a19;
  --foreground: #f0eee7;
  --card: #222622;
  --popover: #222622;
  --primary: #c3a574;
  --primary-foreground: #171a19;
  --accent: #33372f;
  --accent-foreground: #ead9b7;
  --border: #3c4039;
  --ring: #c3a574;
  --sidebar: #1d211e;
}
body { font-family: "Segoe UI", "Microsoft YaHei", sans-serif; }
.ant-menu-item-selected { background: #ebe5d9 !important; color: #755631 !important; }
html[data-theme="dark"] .ant-menu-item-selected { background: #34382f !important; color: #dbc399 !important; }
.ant-btn-primary { background: #8f6d3f !important; border-color: #8f6d3f !important; }
.ant-btn-primary:hover { background: #755631 !important; }
.ant-checkbox-checked .ant-checkbox-inner { background: #8f6d3f !important; border-color: #8f6d3f !important; }
.ant-input-affix-wrapper-focused, .ant-input:focus, .ant-input-affix-wrapper:hover { border-color:#b79765 !important; box-shadow:0 0 0 2px rgba(183,151,101,.10) !important; }
[class*="sidebarBrand"], [class*="brandRow"] { padding-top: 8px; padding-bottom: 8px; }
img[src*="octop-mascot"], video[src*="octop-mascot"] { display: none !important; }
img[alt="ST STUDIO"] { max-width: 190px !important; }
#octop-boot-ring { border-top-color: #b79765 !important; }
.st-wordmark { letter-spacing: .17em; font-weight: 650; }
.studio-brand { display:flex; align-items:center; gap:10px; margin-bottom:28px; }
.studio-brand img { width:44px; height:44px; border-radius:10px; }
.studio-brand strong { font-size:20px; letter-spacing:.16em; }
.studio-brand small { display:block; margin-top:4px; color:#88785e; font-size:10px; letter-spacing:.23em; }
main aside.border-r::before {
  content:"";
  display:block;
  flex:0 0 66px;
  height:66px;
  border-bottom:1px solid var(--border);
  background:url('/st-wordmark-dark.svg') 18px center / 220px 49px no-repeat;
}
html.dark main aside.border-r::before {
  background-image:url('/st-wordmark-white.svg');
}

/* ST STUDIO: a quiet workspace with explicit, reachable actions. */
:root{--primary:#255ce5;--ring:#255ce5;--background:#f5f7fb;--card:#fff;--popover:#fff;--foreground:#202938;--border:#e1e6ee;--sidebar:#fff;--accent:#edf3ff;--fn-color-brand:#255ce5!important;--fn-color-brand-hover:#1947c7!important;--fn-accent-primary:#255ce5!important;--fn-bg-primary:#fff!important;--fn-bg-secondary:#f5f7fb!important;--fn-text-primary:#202938!important;--fn-border-default:#e1e6ee!important}
html.dark{--primary:#7a9bff;--ring:#7a9bff;--background:#151923;--card:#202634;--popover:#202634;--foreground:#edf1f9;--border:#333d50;--sidebar:#1b2130;--accent:#283756;--fn-color-brand:#7a9bff!important;--fn-color-brand-hover:#9bb3ff!important;--fn-accent-primary:#7a9bff!important;--fn-bg-primary:#1b2130!important;--fn-bg-secondary:#151923!important;--fn-text-primary:#edf1f9!important;--fn-border-default:#333d50!important}
body.cloud-app{padding-top:64px;background:var(--background)}
body.cloud-app #root .h-screen{height:calc(100dvh - 64px)}
#cloud-bar{height:64px;padding:0 24px;gap:24px;background:var(--card);color:var(--foreground);border-bottom:1px solid var(--border);font:13px 'Segoe UI','Microsoft YaHei',sans-serif;box-shadow:none}
#cloud-bar a{text-decoration:none;color:inherit}
#cloud-bar .cloud-brand{display:flex;align-items:center;gap:9px;white-space:nowrap;letter-spacing:.08em}
#cloud-bar .cloud-brand img{width:28px;height:28px}
.studio-nav{display:flex;align-items:center;gap:6px;margin-right:auto}
.studio-nav a{padding:10px 13px;border-radius:8px;color:#6b7587!important;white-space:nowrap}
.studio-nav a:hover,.studio-nav a[aria-current=page]{background:var(--accent);color:var(--primary)!important}
#cloud-bar .cloud-actions{gap:14px;white-space:nowrap}
#cloud-status{max-width:145px;overflow:hidden;text-overflow:ellipsis;font-size:11px;color:#7f899a}
#cloud-credits{font-size:12px;background:var(--background);padding:8px 11px;border-radius:7px}
#cloud-bar #cloud-save{background:#255ce5;color:white;padding:10px 15px;border-radius:8px;font-weight:600}
#cloud-bar #cloud-save:hover{background:#1947c7}
#cloud-bar #cloud-save:disabled{opacity:.5;cursor:wait}
.studio-account{position:relative}
.studio-account summary{cursor:pointer;list-style:none;display:flex;gap:9px;align-items:center;padding:8px;border-radius:7px}
.studio-account summary::-webkit-details-marker{display:none}
.studio-account summary:hover{background:var(--background)}
.studio-account-menu{position:absolute;right:0;top:42px;width:190px;padding:7px;background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 36px #121c3020;display:flex;flex-direction:column;gap:3px;z-index:10001}
#cloud-bar .studio-account-menu a,#cloud-bar .studio-account-menu button{padding:11px 12px;text-align:left;border-radius:6px;color:var(--foreground);font-size:13px}
.studio-account-menu a:hover,.studio-account-menu button:hover{background:var(--accent)!important}
.studio-account-menu [hidden]{display:none!important}
body.cloud-app #root header:has(nav),body.cloud-app aside.border-l,.studio-advanced-hidden{display:none!important}
body.cloud-app main aside.border-r::before{display:none}
body.cloud-app aside.border-r{background:var(--sidebar)!important;border-color:var(--border)!important}
body.cloud-app button[title='打开本地 Codex 面板'],body.cloud-app button[aria-label='打开 Agent'],body.cloud-app button[aria-label='节点插件'],body.cloud-app button[title='查看版本更新'],body.cloud-app a[href='https://docs.canvas.best'],body.cloud-app a[href='https://github.com/basketikun/infinite-canvas'],body.cloud-app button[aria-label='切换到 English']{display:none!important}
body.cloud-app .node-element{color:var(--foreground)}
body.cloud-app .node-element>div.h-full.w-full{background:var(--card)!important;border-color:var(--border)!important;box-shadow:0 5px 18px #122b4b0c}
body.cloud-app .node-element.studio-generation>div.h-full.w-full{border-color:#9cb6ff!important;box-shadow:0 5px 20px #255ce51a}
body.cloud-app .studio-generate-button{background:#255ce5!important;border:0!important;color:#fff!important;border-radius:9px!important;min-height:36px;font-weight:600!important}
body.cloud-app .studio-generate-button:disabled{background:#dfe6f5!important;color:#8593b1!important}
body.cloud-app .studio-tools{background:var(--card)!important;border-color:var(--border)!important;color:var(--foreground)!important;box-shadow:0 6px 24px #142b4510!important;height:58px!important;padding:7px 10px!important;gap:5px!important;border-radius:14px!important}
.studio-tools button{color:var(--foreground)!important;min-height:40px!important;border-radius:8px!important}
.studio-tools button:hover{background:var(--accent)!important}
.studio-tools button[aria-label='文本'],.studio-tools button[aria-label='图片'],.studio-tools button[aria-label='生成配置'],.studio-tools button[aria-label='上传资产']{width:auto!important;min-width:68px!important;padding:0 10px!important;display:inline-flex;align-items:center;gap:6px!important}
.studio-tools button[aria-label='文本']::after{content:'文字'}
.studio-tools button[aria-label='图片']::after{content:'参考图'}
.studio-tools button[aria-label='生成配置']::after{content:'生成';font-weight:600}
.studio-tools button[aria-label='上传资产']::after{content:'上传'}
.studio-tools button[aria-label='生成配置']{background:#255ce5!important;color:white!important}
body.cloud-app .ant-select-selector,body.cloud-app .ant-input{border-radius:8px!important}
body.cloud-app .ant-btn-primary{background:#255ce5!important;border-color:#255ce5!important}
body.cloud-app button:focus-visible,body.cloud-app a:focus-visible,summary:focus-visible{outline:2px solid #255ce5;outline-offset:3px}
.login-body{background:#f5f7fb;color:#202938}
.login-layout{gap:80px;max-width:1100px}
.login-card{border:1px solid #e1e6ee;border-radius:18px;box-shadow:0 8px 28px #122b4b08}
.login-card .primary{background:#255ce5;text-align:center;font-weight:600;border-radius:9px;min-height:48px}
.login-card .primary:hover{background:#1947c7}
.login-card .primary span{float:none;margin-left:12px}
.login-card input{background:#fff;border-radius:9px;min-height:46px}
.login-card input:focus{border-color:#255ce5;box-shadow:0 0 0 3px #255ce510}
.login-layout .architecture{opacity:.75;transform:scale(.85);transform-origin:left center}
.login-layout h1{font-size:40px;font-weight:650;line-height:1.45;letter-spacing:-1px}
.login-layout .small-tag,.login-layout .eyebrow{color:#8490a5}
@media(max-width:1100px){#cloud-bar{gap:12px;padding:0 14px}.studio-nav{gap:2px}.studio-nav a{padding:9px}#cloud-status{display:none}}
@media(max-width:720px){body.cloud-app{padding-top:102px}body.cloud-app #root .h-screen{height:calc(100dvh - 102px)}#cloud-bar{height:102px;flex-wrap:wrap;gap:0;padding:10px 12px;align-content:space-between}#cloud-bar .cloud-brand{display:flex;font-size:12px}#cloud-bar .cloud-brand img{width:24px;height:24px}.studio-nav{order:3;width:100%;justify-content:space-between;margin:0;border-top:1px solid var(--border);padding-top:5px}.studio-nav a{padding:7px 12px;font-size:12px}#cloud-bar .cloud-actions{margin-left:auto;gap:7px}#cloud-bar #cloud-save{padding:8px 10px;font-size:12px}#cloud-credits{padding:7px;font-size:11px}.studio-account summary{padding:5px}#cloud-user{max-width:65px;overflow:hidden;text-overflow:ellipsis}.studio-tools{max-width:calc(100vw - 24px)!important}.login-layout{padding:28px 20px;gap:20px}.login-layout h1{font-size:28px}.login-layout .studio-brand{margin-bottom:16px}.login-layout .intro-copy{display:none}.login-layout .eyebrow{margin-top:5px}.login-card{padding:25px}.login-card h2{font-size:23px}}

body.cloud-app #root .h-dvh{height:calc(100dvh - 64px)}
body.cloud-app .studio-generation>div.h-full.w-full>div.h-full{background:var(--card)!important}
html.dark #cloud-bar .cloud-brand img{filter:invert(1)}
@media(max-width:720px){body.cloud-app #root .h-dvh{height:calc(100dvh - 102px)}}

.studio-tools button::after{position:static!important;inset:auto!important;display:inline-block!important;flex:0 0 auto;font-size:12px;line-height:20px;opacity:1!important;box-shadow:none!important;border:0!important;pointer-events:none}
.studio-tools button[aria-label='文本'],.studio-tools button[aria-label='图片'],.studio-tools button[aria-label='生成配置'],.studio-tools button[aria-label='上传资产']{min-width:78px!important;flex:0 0 auto!important;max-width:none!important}

body.cloud-app .studio-tools button[aria-label='视频'],body.cloud-app .studio-tools button[aria-label='音频']{display:none!important}
.studio-tools button[aria-label='文本'],.studio-tools button[aria-label='生成配置'],.studio-tools button[aria-label='上传资产']{min-width:68px!important}