*{scrollbar-width:thin;scrollbar-color:#27272A transparent}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#27272A;border-radius:2px}
body{background:#09090B;color:#FAFAFA;-webkit-font-smoothing:antialiased}
.glass{background:rgba(24,24,27,.85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.card{background:#18181B;border:1px solid #27272A;transition:all .3s ease}
.card:hover{transform:translateY(-2px);border-color:rgba(99,102,241,.35);box-shadow:0 8px 32px rgba(0,0,0,.5)}
.card-featured{background:linear-gradient(135deg,rgba(99,102,241,.04),rgba(139,92,246,.02));border:1px solid rgba(139,92,246,.15)}
.card-featured:hover{border-color:rgba(139,92,246,.35);box-shadow:0 8px 32px rgba(0,0,0,.5),0 0 60px rgba(139,92,246,.04)}
.gradient-text{background:linear-gradient(135deg,#818CF8,#A78BFA,#C084FC);-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.gradient-border{position:relative}.gradient-border::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(192,132,252,.08));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.btn-primary{background:#6366F1;color:#fff;font-weight:600;transition:all .2s}.btn-primary:hover{background:#7070F5;box-shadow:0 6px 24px rgba(99,102,241,.35);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}
.btn-secondary{background:rgba(28,28,31,.9);border:1px solid #27272A;color:#A1A1AA;font-weight:500;transition:all .2s}.btn-secondary:hover{background:rgba(35,35,39,.9);border-color:rgba(99,102,241,.2);color:#FAFAFA}
.btn-danger{background:rgba(239,68,68,.08);border:1px solid rgba(239,68,68,.15);color:#EF4444;font-weight:500;transition:all .2s}.btn-danger:hover{background:rgba(239,68,68,.15);border-color:rgba(239,68,68,.3)}
.chat-bubble-user{background:linear-gradient(135deg,#6366F1,#4F46E5);box-shadow:0 4px 18px rgba(99,102,241,.25)}
.chat-bubble-ai{background:#18181B;border:1px solid #27272A}
.view{display:none}.view.active{display:block}
.modal-backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#skills-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.skills-hero{background:linear-gradient(135deg,rgba(99,102,241,.12) 0%,rgba(15,15,18,.95) 45%,rgba(168,85,247,.08) 100%);border:1px solid rgba(99,102,241,.18);border-radius:20px;padding:20px 24px;margin-bottom:20px;position:relative;overflow:hidden}
.skills-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 100% 0%,rgba(99,102,241,.15),transparent 55%);pointer-events:none}
.skills-tab-pill{padding:8px 16px;border-radius:12px;font-size:13px;font-weight:500;color:#a1a1aa;border:1px solid transparent;background:transparent;transition:all .2s}
.skills-tab-pill-active{background:rgba(99,102,241,.15);color:#c7d2fe;border-color:rgba(99,102,241,.35)}
.skills-cat-pill{padding:8px 14px;border-radius:999px;font-size:12px;font-weight:500;color:#a1a1aa;border:1px solid rgba(39,39,42,.9);background:rgba(24,24,27,.6);white-space:nowrap;display:inline-flex;align-items:center;gap:6px;transition:all .2s}
.skills-cat-pill-active{background:rgba(99,102,241,.2);color:#fff;border-color:rgba(99,102,241,.45)}
.skills-price-active{background:#27272a!important;color:#fff!important}
.skill-card{position:relative;border-radius:18px;transition:transform .28s ease}
.skill-card:hover{transform:translateY(-4px)}
.skill-card-glow{position:absolute;inset:-1px;border-radius:19px;background:linear-gradient(135deg,rgba(99,102,241,.35),rgba(168,85,247,.15),transparent 60%);opacity:0;transition:opacity .28s;z-index:0}
.skill-card:hover .skill-card-glow{opacity:1}
.skill-card-inner{position:relative;z-index:1;background:linear-gradient(180deg,rgba(28,28,31,.98),rgba(18,18,20,.98));border:1px solid rgba(63,63,70,.55);border-radius:18px;padding:18px 18px 14px;min-height:240px;display:flex;flex-direction:column}
.skill-card-icon{width:44px;height:44px;border-radius:14px;background:linear-gradient(145deg,rgba(99,102,241,.25),rgba(79,70,229,.08));border:1px solid rgba(99,102,241,.25);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}
.skill-badge{font-size:9px;padding:2px 8px;border-radius:6px;background:#27272a;color:#71717a}
.skill-badge-warn{background:rgba(245,158,11,.12);color:#fbbf24}
.skill-chip{font-size:10px;padding:3px 8px;border-radius:8px;background:rgba(39,39,42,.8);color:#a1a1aa}
.skill-chip-free{color:#34d399;background:rgba(16,185,129,.08)}
.skill-chip-paid{color:#fbbf24;background:rgba(245,158,11,.08)}
.skill-card-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding-top:12px;margin-top:auto;border-top:1px solid rgba(39,39,42,.8)}
.skill-btn-install{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 14px;border-radius:10px;font-size:12px;font-weight:600;color:#fff;background:linear-gradient(135deg,#6366f1,#4f46e5);border:1px solid rgba(129,140,248,.35);box-shadow:0 4px 14px rgba(79,70,229,.25);transition:transform .15s,box-shadow .15s;white-space:nowrap;max-width:100%}
.skill-btn-install:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(79,70,229,.35)}
.skill-btn-install:disabled{opacity:.55;transform:none;cursor:not-allowed}
.skill-btn-install svg,.skill-btn-install .si{width:14px;height:14px;opacity:.9}
.skill-btn-secondary{display:inline-flex;align-items:center;padding:6px 12px;border-radius:9px;font-size:11px;font-weight:500}
.skill-installed-label{font-size:11px;color:#34d399;margin-right:auto}
.skills-state-card{grid-column:1/-1;border-radius:20px;border:1px dashed rgba(63,63,70,.8);padding:48px 24px;text-align:center;color:#71717a;font-size:13px}
.skills-spinner{width:28px;height:28px;border:2px solid rgba(99,102,241,.2);border-top-color:#6366f1;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}
@keyframes spin{to{transform:rotate(360deg)}}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.badge-free{background:rgba(16,185,129,.06);border:1px solid rgba(16,185,129,.12);color:#10B981}
.badge-coin{background:rgba(245,158,11,.06);border:1px solid rgba(245,158,11,.12);color:#F59E0B}
.tag-agent{background:rgba(99,102,241,.08);border:1px solid rgba(99,102,241,.12);color:#A5B4FC;font-size:10px;padding:2px 8px;border-radius:6px;font-weight:500}
.input-glow:focus{box-shadow:0 0 0 3px rgba(99,102,241,.08),0 0 30px rgba(99,102,241,.03)}
.nav-link{cursor:pointer;transition:all .2s}
/* ════════ Hero 动效 ════════ */
@keyframes float{0%,100%{transform:translateY(0) rotate(0deg)}33%{transform:translateY(-18px) rotate(3deg)}66%{transform:translateY(8px) rotate(-2deg)}}
@keyframes float-slow{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,-20px) scale(1.12)}}
@keyframes float-reverse{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(35px,15px) scale(1.1)}}
@keyframes pulse-glow{0%,100%{opacity:.35;transform:translate(-50%,-50%) scale(1)}50%{opacity:.7;transform:translate(-50%,-50%) scale(1.25)}}
@keyframes border-glow{0%,100%{border-color:rgba(99,102,241,.12)}50%{border-color:rgba(99,102,241,.35)}}
@keyframes shimmer{0%{transform:translateX(-100%) skewX(-15deg)}100%{transform:translateX(250%) skewX(-15deg)}}
@keyframes text-reveal{0%{opacity:0;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
@keyframes dot-drift{0%{transform:translate(0,0)}25%{transform:translate(4px,-4px)}50%{transform:translate(0,-8px)}75%{transform:translate(-4px,-4px)}100%{transform:translate(0,0)}}
@keyframes dash-move{0%{stroke-dashoffset:1000}100%{stroke-dashoffset:0}}
.hero-orb{position:absolute;border-radius:50%;pointer-events:none;z-index:0}
.hero-orb-1{width:360px;height:360px;background:radial-gradient(circle,rgba(99,102,241,.22),transparent 70%);top:-100px;right:-60px;animation:float 8s ease-in-out infinite}
.hero-orb-2{width:280px;height:280px;background:radial-gradient(circle,rgba(16,185,129,.15),transparent 70%);bottom:-80px;left:-50px;animation:float-slow 10s ease-in-out infinite}
.hero-orb-3{width:200px;height:200px;background:radial-gradient(circle,rgba(139,92,246,.12),transparent 70%);top:40%;left:55%;transform:translate(-50%,-50%);animation:pulse-glow 6s ease-in-out infinite}
.hero-dots{position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px);background-size:32px 32px;pointer-events:none;z-index:0;animation:dot-drift 18s linear infinite}
.hero-card{position:relative;background:rgba(12,12,16,.94);border:1px solid rgba(99,102,241,.12);animation:border-glow 5s ease-in-out infinite;transition:all .5s ease}
.hero-card::after{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:linear-gradient(135deg,rgba(99,102,241,.3),transparent 35%,transparent 65%,rgba(16,185,129,.18));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;z-index:1}
.hero-shimmer{position:absolute;top:0;left:0;width:80px;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);animation:shimmer 5s ease-in-out infinite;animation-delay:2s;pointer-events:none;z-index:2}
.hero-badge{background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.18);backdrop-filter:blur(12px)}
.hero-tag{backdrop-filter:blur(12px);transition:all .3s ease}
.hero-tag:hover{transform:translateY(-3px);box-shadow:0 6px 24px rgba(99,102,241,.2)}
.hero-title-reveal{animation:text-reveal .7s cubic-bezier(.16,1,.3,1) both}
.hero-title-reveal:nth-child(2){animation-delay:.1s}
.hero-layout{display:grid;gap:2rem;align-items:center}
@media(min-width:1024px){.hero-layout{grid-template-columns:1fr min(400px,44%);gap:2.25rem}}
.hero-copy{padding-top:0;display:flex;flex-direction:column}
.hero-status{margin:-2px 0 1rem;align-self:flex-start}
@media(min-width:768px){.hero-status{margin-top:-4px;margin-bottom:1.125rem}}
.hero-h1{margin-bottom:.875rem;line-height:1.06;letter-spacing:-.02em}
@media(min-width:768px){.hero-h1{margin-bottom:1rem}}
.hero-h2{margin-bottom:1.25rem;line-height:1.14;letter-spacing:-.015em}
@media(min-width:768px){.hero-h2{margin-bottom:1.5rem}}
.hero-desc{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1.625rem;max-width:34rem}
@media(min-width:768px){.hero-desc{gap:.875rem;margin-bottom:1.75rem}}
.hero-subline{text-wrap:balance;line-height:1.65;letter-spacing:.01em}
.hero-subfeat{font-size:.8125rem;line-height:1.7;color:#a1a1aa;letter-spacing:.02em}
@media(min-width:768px){.hero-subfeat{font-size:.875rem}}
.hero-subfeat span{color:#71717a}
.hero-subfeat em{font-style:normal;color:#a5b4fc}
.hero-cta{gap:.75rem}
@media(min-width:640px){.hero-cta{gap:.875rem}}
.hero-card .hero-badge{box-shadow:0 0 20px rgba(16,185,129,.08)}
.hero-worker-scene{position:relative;height:292px;min-height:260px;margin:0 auto;max-width:400px}
@media(min-width:1024px){.hero-worker-scene{height:320px;margin:0;max-width:420px}}
.hw-glow{position:absolute;inset:5% 0 22%;background:radial-gradient(ellipse 65% 50% at 50% 40%,rgba(99,102,241,.18),transparent 70%);pointer-events:none}
.hw-badge-24h{position:absolute;top:2%;right:4%;z-index:20;padding:6px 12px;border-radius:999px;font-size:11px;font-weight:700;color:#fef3c7;background:linear-gradient(135deg,rgba(245,158,11,.92),rgba(234,88,12,.88));border:1px solid rgba(253,224,71,.45);box-shadow:0 4px 20px rgba(245,158,11,.28);animation:hw-badge-pulse 2s ease-in-out infinite}
@keyframes hw-badge-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.hw-ws{position:relative;height:calc(100% - 20px);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:28px}
.hw-mon{width:min(100%,320px);flex-shrink:0}
.hw-mon-bezel{padding:8px 10px 6px;border-radius:14px 14px 6px 6px;background:linear-gradient(165deg,#52525b,#27272a);border:1px solid rgba(255,255,255,.12);box-shadow:0 16px 48px rgba(0,0,0,.55),0 0 0 1px rgba(99,102,241,.15)}
.hw-mon-screen{position:relative;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#0c4a6e;box-shadow:inset 0 0 24px rgba(0,0,0,.35)}
.hw-slide{position:absolute;inset:0;opacity:0;pointer-events:none;display:flex;flex-direction:column;padding:10px 12px;font-size:10px;color:#f8fafc;animation:hw-slide-cycle 16s infinite;animation-fill-mode:both}
.hw-slide:nth-child(1){background:linear-gradient(145deg,#0f172a,#1e3a5f);animation-delay:0s}
.hw-slide:nth-child(2){background:linear-gradient(145deg,#312e81,#4338ca);animation-delay:4s}
.hw-slide:nth-child(3){background:linear-gradient(145deg,#14532d,#166534);animation-delay:8s}
.hw-slide:nth-child(4){background:linear-gradient(145deg,#7c2d12,#c2410c);animation-delay:12s}
@keyframes hw-slide-cycle{0%{opacity:0;transform:scale(.98)}4%,22%{opacity:1;transform:scale(1)}26%,100%{opacity:0;transform:scale(.99)}}
.hw-slide-hd{display:flex;align-items:center;gap:6px;margin-bottom:8px;font-weight:700;font-size:11px}
.hw-slide-dot{width:6px;height:6px;border-radius:50%;background:#4ade80;animation:hw-dot-blink 1s ease-in-out infinite}
@keyframes hw-dot-blink{0%,100%{opacity:1}50%{opacity:.35}}
.hw-slide-code{font-family:ui-monospace,monospace;font-size:9px;line-height:1.55;color:#a5f3fc;flex:1;overflow:hidden}
.hw-slide-code .ln{display:block;white-space:nowrap;animation:hw-code-scroll 3s linear infinite}
.hw-slide-code .ln:nth-child(2){animation-delay:.4s;color:#67e8f9}
.hw-slide-code .ln:nth-child(3){animation-delay:.8s;color:#5eead4}
.hw-slide-code .ln:nth-child(4){animation-delay:1.2s}
@keyframes hw-code-scroll{0%{opacity:.5;transform:translateX(-4px)}50%{opacity:1}100%{opacity:.5;transform:translateX(2px)}}
.hw-slide-ppt{display:grid;grid-template-columns:1fr 1.2fr;gap:8px;flex:1}
.hw-ppt-thumb{aspect-ratio:4/3;border-radius:4px;background:rgba(255,255,255,.15);animation:hw-ppt-pop .8s ease-in-out infinite alternate}
.hw-ppt-lines{display:flex;flex-direction:column;gap:5px;justify-content:center}
.hw-ppt-line{height:5px;border-radius:3px;background:rgba(255,255,255,.3);animation:hw-bar-grow 1.4s ease-in-out infinite}
.hw-ppt-line:nth-child(1){width:100%}.hw-ppt-line:nth-child(2){width:78%;animation-delay:.2s}.hw-ppt-line:nth-child(3){width:55%;animation-delay:.4s}
@keyframes hw-ppt-pop{from{transform:scale(.96)}to{transform:scale(1)}}
.hw-slide-video{flex:1;display:flex;flex-direction:column;gap:6px}
.hw-vid-frame{flex:1;border-radius:6px;background:rgba(0,0,0,.35);position:relative;overflow:hidden}
.hw-vid-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.hw-vid-play::after{content:'';border-style:solid;border-width:8px 0 8px 14px;border-color:transparent transparent transparent rgba(255,255,255,.85);animation:hw-play-pulse 1.2s ease-in-out infinite}
@keyframes hw-play-pulse{0%,100%{opacity:.7;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
.hw-vid-timeline{height:5px;border-radius:3px;background:rgba(255,255,255,.2);overflow:hidden}
.hw-vid-progress{height:100%;width:35%;background:linear-gradient(90deg,#f472b6,#fb7185);border-radius:3px;animation:hw-vid-seek 4s linear infinite}
@keyframes hw-vid-seek{0%{width:12%}100%{width:88%}}
.hw-slide-chart{flex:1;display:flex;align-items:flex-end;gap:6px;padding-bottom:4px}
.hw-chart-bar{flex:1;border-radius:4px 4px 0 0;background:rgba(255,255,255,.35);animation:hw-chart-bounce 1.6s ease-in-out infinite}
.hw-chart-bar:nth-child(1){height:45%;animation-delay:0s}
.hw-chart-bar:nth-child(2){height:72%;animation-delay:.15s}
.hw-chart-bar:nth-child(3){height:55%;animation-delay:.3s}
.hw-chart-bar:nth-child(4){height:90%;animation-delay:.45s}
.hw-chart-bar:nth-child(5){height:38%;animation-delay:.6s}
@keyframes hw-chart-bounce{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.12)}}
.hw-mon-stand{width:38%;height:26px;margin:0 auto;background:linear-gradient(90deg,#3f3f46,#71717a 50%,#3f3f46);border-radius:0 0 6px 6px;box-shadow:0 6px 16px rgba(0,0,0,.3)}
.hw-mon-stand::after{content:'';display:block;width:140%;height:8px;margin:0 auto;background:linear-gradient(90deg,transparent,#52525b,transparent);border-radius:50%}
.hw-kb-zone{position:relative;width:min(100%,300px);margin-top:10px;z-index:5}
.hw-hands{position:absolute;top:-2px;left:50%;width:92%;transform:translateX(-50%);z-index:8;pointer-events:none}
.hw-hand-l,.hw-hand-r{transform-origin:center bottom}
.hw-hand-l{animation:hw-hand-l 0.55s ease-in-out infinite}
.hw-hand-r{animation:hw-hand-r 0.55s ease-in-out infinite .27s}
@keyframes hw-hand-l{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(5px) rotate(1deg)}}
@keyframes hw-hand-r{0%,100%{transform:translateY(0) rotate(2deg)}50%{transform:translateY(5px) rotate(-1deg)}}
.hw-finger{animation:hw-finger-tap 0.55s ease-in-out infinite;transform-origin:center bottom}
.hw-finger-d{animation-delay:.12s}
@keyframes hw-finger-tap{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
@keyframes hw-bar-grow{0%,100%{opacity:.45}50%{opacity:1}}
.hw-kb{padding:10px 12px 8px;border-radius:10px;background:linear-gradient(180deg,#3f3f46 0%,#18181b 100%);border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 24px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.06)}
.hw-kb-rows{display:flex;flex-direction:column;gap:4px}
.hw-kb-row{display:flex;gap:3px;justify-content:center}
.hw-key{--k:0;display:block;height:9px;border-radius:2px;background:#52525b;flex:1;max-width:14px;animation:hw-key-hit 1.2s ease-in-out infinite;animation-delay:calc(var(--k) * 0.07s);animation-fill-mode:both}
.hw-key.w2{flex:1.8;max-width:22px}.hw-key.w3{flex:2.4;max-width:32px}
@keyframes hw-key-hit{0%,88%,100%{background:#52525b;transform:translateY(0);box-shadow:none}8%{background:#6366f1;transform:translateY(2px);box-shadow:0 0 10px rgba(99,102,241,.55)}}
.hw-caption{display:none}
/* hero-worker-scene: keep decorative carousel/typing even when prefers-reduced-motion */
/* ════════ Survey ════════ */
.survey-option{transition:all .25s ease;cursor:pointer}
.survey-option:hover{transform:translateY(-1px)}
.survey-option.selected{border-color:#6366F1!important;background:rgba(99,102,241,.1)!important;box-shadow:0 0 24px rgba(99,102,241,.15)}
.survey-step-dot{transition:all .3s}
.survey-step-dot.active{background:#6366F1;box-shadow:0 0 12px rgba(99,102,241,.4)}
/* ════════ Platform Cards ════════ */
.platform-card{cursor:pointer;transition:all .3s ease}
.platform-card:hover{transform:translateY(-3px);box-shadow:0 8px 32px rgba(0,0,0,.4)}
.platform-card.connected{border-color:rgba(16,185,129,.3)!important;background:rgba(16,185,129,.04)!important}
.platform-card.connected::after{content:'✓';position:absolute;top:8px;right:10px;width:20px;height:20px;border-radius:50%;background:#10B981;color:#fff;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700}
/* ════════ Onboarding Progress ════════ */
.onboard-progress-bar{transition:width .6s cubic-bezier(.16,1,.3,1)}
/* ════════ Workspace Model Bar ════════ */
.model-bar-btn{transition:all .2s}
.model-bar-btn:hover{background:rgba(99,102,241,.1);border-color:rgba(99,102,241,.2)}
.model-status-dot.ready{background:#10B981;box-shadow:0 0 6px rgba(16,185,129,.4)}
.model-status-dot.needed{background:#F59E0B;box-shadow:0 0 6px rgba(245,158,11,.4)}
/* ════════ Workspace Chat Markdown ════════ */
.msg-render{line-height:1.7;word-break:break-word}
.msg-render p{margin:0 0 .6em}.msg-render p:last-child{margin-bottom:0}
.msg-render code{background:rgba(99,102,241,.15);color:#A5B4FC;padding:2px 6px;border-radius:4px;font-size:.8em;font-family:'Cascadia Code','Fira Code','JetBrains Mono',monospace}
.msg-render pre{background:#0D0D12;border:1px solid #27272A;border-radius:10px;padding:14px;margin:10px 0;overflow-x:auto;position:relative}
.msg-render pre code{background:0 0;color:#E4E4E7;padding:0;font-size:.78em;line-height:1.55;border-radius:0}
.msg-render .code-lang{position:absolute;top:8px;right:12px;font-size:10px;color:#71717A;text-transform:uppercase;letter-spacing:.04em}
.msg-render .copy-btn{position:absolute;top:6px;right:10px;font-size:10px;padding:3px 8px;border-radius:5px;background:#27272A;color:#A1A1AA;cursor:pointer;transition:all .15s;border:none}
.msg-render .copy-btn:hover{background:#3F3F46;color:#fff}
.msg-render .preview-btn{position:absolute;top:6px;right:56px;font-size:10px;padding:3px 8px;border-radius:5px;background:rgba(99,102,241,.15);color:#818CF8;cursor:pointer;transition:all .15s;border:1px solid rgba(99,102,241,.2)}
.msg-render .preview-btn:hover{background:rgba(99,102,241,.3);color:#A5B4FC}
.msg-render ul,.msg-render ol{padding-left:1.5em;margin:.5em 0}
.msg-render li{margin:.2em 0}
.msg-render strong{color:#fff;font-weight:600}
.msg-render a{color:#818CF8;text-decoration:underline}
.msg-render table{border-collapse:collapse;width:100%;margin:.5em 0;font-size:.82em}
.msg-render th{background:rgba(99,102,241,.12);color:#E4E4E7;padding:8px 12px;text-align:left;font-weight:600;border:1px solid #27272A}
.msg-render td{padding:6px 12px;border:1px solid #27272A;color:#D4D4D8}
.msg-render blockquote{border-left:2px solid #6366F1;padding-left:12px;color:#A1A1AA;margin:.5em 0}
.msg-render h1,.msg-render h2,.msg-render h3{color:#fff;margin:.8em 0 .4em;font-weight:600}
.msg-render h1{font-size:1.2em}.msg-render h2{font-size:1.1em}.msg-render h3{font-size:1em}
.chat-artifact{margin:12px 0;border:1px solid #27272A;border-radius:12px;overflow:hidden;background:#0D0D12}
.chat-artifact-head{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#141820;border-bottom:1px solid #27272A;font-size:11px}
.chat-artifact-head .art-lang{font-weight:600;color:#A5B4FC;font-family:'Cascadia Code',monospace;text-transform:uppercase}
.chat-artifact-head .art-meta{color:#71717A;font-size:10px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chat-artifact-actions{display:flex;gap:4px;flex-shrink:0}
.chat-artifact-actions button{font-size:10px;padding:3px 8px;border-radius:5px;border:1px solid #3F3F46;background:#27272A;color:#D4D4D8;cursor:pointer}
.chat-artifact-actions button:hover{background:#3F3F46;color:#fff}
.chat-artifact-preview{display:block;border-bottom:1px solid #27272A;background:#000}
.chat-artifact-preview iframe{width:100%;height:min(420px,55vh);border:0;background:#fff;display:block}
.chat-artifact-source{margin:0;padding:12px 14px;max-height:280px;overflow:auto;font-size:12px;line-height:1.55;background:#0D0D12}
.chat-artifact-source code{font-family:'Cascadia Code','Fira Code',monospace;color:#E4E4E7}
.chat-artifact.diff .chat-artifact-source code{color:#86EFAC}
.chat-artifact.collapsed .chat-artifact-preview,.chat-artifact.collapsed .chat-artifact-source{display:none}
#artifact-modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.85);padding:16px}
#artifact-modal.open{display:flex}
#artifact-modal .am-box{width:min(960px,96vw);height:min(720px,92vh);background:#0D0D12;border:1px solid #3F3F46;border-radius:14px;display:flex;flex-direction:column;overflow:hidden}
#artifact-modal .am-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid #27272A}
#artifact-modal iframe{flex:1;border:0;background:#fff;width:100%}
#artifact-modal pre.am-code{flex:1;margin:0;padding:14px;overflow:auto;font-size:12px}
/* ════════ Desktop Panel ════════ */
.desktop-panel{transition:all .3s ease}
.desktop-panel.minimized{width:48px!important;min-width:48px!important}
.desktop-fullscreen{position:fixed;inset:0;z-index:100;background:#000;display:flex;flex-direction:column}
.desktop-fullscreen #workspace-stream-fullscreen{flex:1;min-height:0;width:100%;position:relative;display:flex;flex-direction:column}
.desktop-fullscreen #workspace-stream-fullscreen iframe{flex:1;width:100%!important;height:100%!important;min-height:0!important;border:0}
.desktop-stream-stage{position:relative;width:100%;aspect-ratio:16/9;max-height:46vh;background:#000;flex-shrink:0}
.desktop-stream-stage #workspace-stream{position:absolute;inset:0;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden}
.desktop-stream-stage #workspace-stream iframe{width:100%!important;height:100%!important;min-height:0!important;border:0;display:block}
.desktop-side-panel{flex:1;min-height:0;overflow-y:auto;border-top:1px solid #27272A;background:#0a0a0f}
body.ybj-desktop-fs{overflow:hidden}
body.ybj-desktop-fs>header{display:none!important}
body.ybj-desktop-fs #v-workspace{overflow:hidden;height:100dvh!important;max-height:100dvh!important;width:100vw!important}
body.ybj-desktop-fs #v-workspace>.flex>.flex-1:first-child{display:none!important}
body.ybj-desktop-fs #workspace-desktop-panel{position:fixed!important;inset:0!important;z-index:250!important;width:100vw!important;max-width:none!important;height:100dvh!important;border:none!important;background:#000;margin:0!important}
body.ybj-desktop-fs #workspace-desktop-panel .desktop-side-panel{display:none}
body.ybj-desktop-fs #workspace-desktop-panel .desktop-panel-toolbar{display:none!important}
body.ybj-desktop-fs #workspace-desktop-panel .desktop-stream-stage{flex:1!important;max-height:none!important;aspect-ratio:unset!important;height:100%!important;width:100%!important}
body.ybj-desktop-fs #workspace-desktop-panel #workspace-stream{position:absolute!important;inset:0!important;display:block!important;background:#000;overflow:hidden}
body.ybj-desktop-fs #workspace-desktop-panel #workspace-stream iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;border:0;display:block}
body.ybj-desktop-fs #workspace-stream.rp-stream-host,
body.ybj-desktop-fs #workspace-stream.rp-stream-host iframe{cursor:none!important}
body.ybj-desktop-fs #workspace-desktop-panel{cursor:none!important}
body.ybj-desktop-fs #ybj-fs-exit,
body.ybj-desktop-fs #ybj-fs-exit *{cursor:pointer!important}
body.ybj-desktop-fs #stream-tap-hint{display:none!important}
#ybj-fs-exit{display:none;position:fixed;top:12px;right:12px;z-index:300;align-items:center;gap:6px;padding:8px 14px;border-radius:10px;background:rgba(24,24,27,.92);border:1px solid rgba(63,63,70,.8);color:#fafafa;font-size:12px;cursor:pointer;backdrop-filter:blur(8px);box-shadow:0 4px 24px rgba(0,0,0,.45)}
#ybj-fs-exit:hover{background:rgba(39,39,42,.95)}
body.ybj-desktop-fs #ybj-fs-exit{display:inline-flex!important}
.deliverable-item{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;border:1px solid #27272A;margin-bottom:6px;background:#141820;font-size:11px}
.deliverable-item:hover{border-color:#4f46e5}
/* ════════ File Upload ════════ */
.file-chip{background:rgba(99,102,241,.08);border:1px solid rgba(99,102,241,.15);border-radius:8px;padding:4px 10px;font-size:11px;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:all .2s}
.file-chip:hover{background:rgba(99,102,241,.15);border-color:rgba(99,102,241,.3)}

/* ════════ UI 增强 v2 ════════ */

/* 更柔和的聊天气泡 */
.chat-bubble-user{background:linear-gradient(135deg,#6366F1,#4F46E5);box-shadow:0 4px 18px rgba(99,102,241,.25)}
.chat-bubble-user:hover{box-shadow:0 6px 24px rgba(99,102,241,.35)}
.chat-bubble-ai{background:#18181B;border:1px solid #27272A;transition:all .2s}
.chat-bubble-ai:hover{border-color:rgba(99,102,241,.25)}

/* 工作台消息流式渐变入场 */
@keyframes msgSlideIn{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:translateY(0)}}
.ws-msg-enter{animation:msgSlideIn .3s cubic-bezier(.16,1,.3,1) both}

/* 更好的滚动条 */
.workspace-messages::-webkit-scrollbar{width:4px}
.workspace-messages::-webkit-scrollbar-thumb{background:#3F3F46;border-radius:2px}
.workspace-messages::-webkit-scrollbar-track{background:transparent}

/* Agent 卡片悬浮动效增强 */
.skill-card-inner::after{content:'';position:absolute;inset:0;border-radius:18px;opacity:0;background:linear-gradient(135deg,transparent,rgba(99,102,241,.02));transition:opacity .3s;pointer-events:none}
.skill-card:hover .skill-card-inner::after{opacity:1}

/* 文件上传进度条更流畅 */
.ws-up-fill{background:linear-gradient(90deg,#6366F1,#818CF8);transition:width .4s cubic-bezier(.16,1,.3,1)}

/* Artifact 卡片悬浮效果 */
.chat-artifact{transition:border-color .2s,box-shadow .2s}
.chat-artifact:hover{border-color:rgba(99,102,241,.25);box-shadow:0 4px 16px rgba(0,0,0,.3)}

/* 云端桌面预览区圆角统一 */
.desktop-stream-stage{border-radius:12px;overflow:hidden;margin:0 12px 8px}

/* 全屏时的渐变遮罩 */
.desktop-fullscreen{background:radial-gradient(ellipse at center,#0a0a0f,#000)}

/* 按钮点击反馈增强 */
.btn-primary:active{transform:translateY(0) scale(.98)}
.btn-secondary:active{transform:scale(.98)}

/* 模态弹窗入场动画增强 */
@keyframes modalIn{0%{opacity:0;backdrop-filter:blur(0)}100%{opacity:1;backdrop-filter:blur(8px)}}
.modal-backdrop{animation:modalIn .25s ease-out both}

/* 文件上传拖拽区 */
.ws-upload-zone{border:2px dashed rgba(99,102,241,.2);border-radius:12px;padding:24px;text-align:center;transition:all .2s;cursor:pointer}
.ws-upload-zone:hover{border-color:rgba(99,102,241,.4);background:rgba(99,102,241,.03)}
.ws-upload-zone.drag-over{border-color:#6366F1;background:rgba(99,102,241,.08)}

/* 语言切换按钮活性 */
.lang-btn{transition:all .2s}
.lang-btn:hover{opacity:.8}
.lang-btn.active{border-color:#6366F1!important;color:#fff!important;background:rgba(99,102,241,.15)!important}

/* 聊天输入框焦点状态增强 */
#workspace-chat-input:focus{box-shadow:0 0 0 2px rgba(99,102,241,.12),0 0 24px rgba(99,102,241,.04)}

/* 数据表格自适应 */
@media(max-width:640px){
  .msg-render table{font-size:10px}
  .msg-render th,.msg-render td{padding:4px 6px}
  .chat-artifact-preview iframe{height:min(240px,40vh)}
}