.studio-catalog-card[data-v-8c1ef0cd]{position:relative;display:grid;grid-template-rows:auto auto auto 1fr auto;min-height:296px;padding:12px;overflow:visible;border:1px solid var(--studio-line);border-radius:20px;background:#ffffff09;text-align:left;transition:transform .22s cubic-bezier(.2,.9,.2,1),border-color .22s ease,background .22s ease,box-shadow .22s ease;will-change:transform}.studio-catalog-card.is-poster[data-v-8c1ef0cd],.studio-catalog-card.is-course-cover[data-v-8c1ef0cd],.studio-catalog-card.is-course-compact[data-v-8c1ef0cd],.studio-catalog-card.is-course-poster[data-v-8c1ef0cd]{overflow:hidden;align-content:start}.studio-catalog-card.is-course-cover[data-v-8c1ef0cd]{min-height:392px;padding:14px}.studio-catalog-card.is-course-compact[data-v-8c1ef0cd]{min-height:278px;padding:12px;background:linear-gradient(180deg,#ffffff0b,#ffffff05),#ffffff08;grid-template-rows:auto minmax(0,1fr) auto}.studio-catalog-card.is-course-poster[data-v-8c1ef0cd]{aspect-ratio:3 / 4;min-height:0;padding:14px;background:radial-gradient(circle at 14% 10%,rgba(92,151,255,.16),transparent 34%),radial-gradient(circle at 88% 90%,rgba(88,212,106,.1),transparent 36%),linear-gradient(180deg,#ffffff0d,#ffffff04),#ffffff07;grid-template-rows:minmax(0,1fr) auto}.studio-catalog-card.is-course-poster.is-course-poster-editorial[data-v-8c1ef0cd]{aspect-ratio:7 / 5;min-height:0;padding:14px;container-type:inline-size;border-color:#ffffff0d;background:radial-gradient(circle at 14% 12%,rgba(92,151,255,.14),transparent 34%),radial-gradient(circle at 86% 90%,rgba(88,212,106,.08),transparent 36%),linear-gradient(180deg,#ffffff0a,#ffffff03),#ffffff05}.studio-catalog-card[data-v-8c1ef0cd]:hover{transform:translateY(-5px);border-color:var(--studio-line-strong);background:radial-gradient(circle at 82% 8%,rgba(88,212,106,.16),transparent 34%),#ffffff0e;box-shadow:0 22px 60px #0000004d,0 0 0 1px #58d46a09}.studio-catalog-card[data-v-8c1ef0cd]:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:linear-gradient(110deg,transparent 0 32%,rgba(255,255,255,.12) 48%,transparent 66% 100%);transform:translate(-130%);opacity:0;transition:opacity .2s ease;pointer-events:none}.studio-catalog-card[data-v-8c1ef0cd]:hover:after{opacity:1;animation:studioCardSweep-8c1ef0cd 1s ease forwards}.studio-catalog-card[data-tooltip][data-v-8c1ef0cd]:before{content:attr(data-tooltip);position:absolute;z-index:40;left:12px;top:-10px;max-width:min(360px,72vw);padding:9px 12px;border:1px solid var(--studio-line-strong);border-radius:12px;color:var(--studio-text);background:#0a100df5;box-shadow:0 18px 54px #00000061,0 0 0 1px #58d46a0d;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:12px;line-height:1.45;text-align:left;white-space:normal;opacity:0;transform:translateY(calc(-100% + 6px)) scale(.98);transition:opacity .08s ease,transform .12s ease;pointer-events:none}.studio-catalog-card[data-tooltip][data-v-8c1ef0cd]:hover:before{opacity:1;transform:translateY(-100%) scale(1)}.studio-catalog-cover[data-v-8c1ef0cd]{height:158px;margin-bottom:12px;display:grid;place-items:center;overflow:hidden;border-radius:16px;color:var(--studio-green);background:linear-gradient(135deg,#3e77ffb8,#28dfc59e,#58d46a94);transition:transform .22s ease,filter .22s ease,box-shadow .22s ease}.studio-catalog-card.is-poster .studio-catalog-cover[data-v-8c1ef0cd]{height:176px}.studio-catalog-card.is-course-cover .studio-catalog-cover[data-v-8c1ef0cd]{height:214px;border-radius:18px}.studio-catalog-card.is-course-compact .studio-catalog-cover[data-v-8c1ef0cd]{height:142px;border-radius:16px}.studio-catalog-card.is-course-poster .studio-catalog-cover[data-v-8c1ef0cd]{height:auto;width:min(72%,188px);margin:0 auto 12px;border-radius:18px;aspect-ratio:2 / 3}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-cover[data-v-8c1ef0cd]{width:min(78%,204px);margin-bottom:10px;border-radius:20px;box-shadow:0 18px 40px #00000057}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-cover[data-v-8c1ef0cd]{width:100%;height:80%;margin-bottom:0;border-radius:18px 18px 8px 8px;aspect-ratio:auto;box-shadow:0 14px 28px #0000002e}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-cover-media[data-v-8c1ef0cd] .fade-image-img{object-fit:cover!important;object-position:center 38%}.studio-catalog-card.is-course-cover .studio-catalog-badges[data-v-8c1ef0cd]{margin-bottom:10px}.studio-catalog-card.is-course-compact .studio-catalog-badges[data-v-8c1ef0cd]{display:none}.studio-catalog-card.is-course-cover .studio-catalog-badges span[data-v-8c1ef0cd],.studio-catalog-card.is-course-poster .studio-catalog-badges span[data-v-8c1ef0cd]{background:#0a120e85;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-badges span[data-v-8c1ef0cd]{color:#fff5d9;background:#ffd6801f;border:1px solid rgba(255,214,128,.18)}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-badges[data-v-8c1ef0cd]{gap:6px;margin-bottom:2px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-badges span[data-v-8c1ef0cd]{color:#d7fbe4;background:#ffffff17;border:1px solid rgba(255,255,255,.1);padding:3px 7px;font-size:9px}.studio-catalog-card.is-course-cover .studio-catalog-copy[data-v-8c1ef0cd],.studio-catalog-card.is-course-compact .studio-catalog-copy[data-v-8c1ef0cd],.studio-catalog-card.is-course-poster .studio-catalog-copy[data-v-8c1ef0cd]{display:grid;gap:8px;align-content:start}.studio-catalog-card.is-course-compact .studio-catalog-copy[data-v-8c1ef0cd]{gap:6px;min-height:0}.studio-catalog-card.is-course-poster .studio-catalog-copy[data-v-8c1ef0cd]{gap:6px}.studio-catalog-poster-panel[data-v-8c1ef0cd]{display:grid;align-content:start;gap:8px;min-height:0;padding:10px 10px 8px;border:1px solid rgba(255,255,255,.06);border-radius:18px;background:#0c120f75;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.studio-catalog-poster-panel.is-cinematic[data-v-8c1ef0cd]{gap:10px;padding:12px 12px 10px;border-color:#ffffff0a;background:linear-gradient(180deg,#080c0c47,#080c0cb8),#0a0e0d94}.studio-catalog-poster-panel.is-editorial[data-v-8c1ef0cd]{gap:8px;padding:10px 12px 9px;border-color:#76e4ad1f;background:linear-gradient(180deg,#ffffff0d,#ffffff05),#0e161280;box-shadow:inset 0 0 0 1px #ffffff05}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]{display:grid;align-content:start;grid-template-rows:auto auto auto auto;position:absolute;left:14px;right:14px;bottom:10px;z-index:2;height:35%;margin-top:0;margin-bottom:0;padding:11px 14px 14px;gap:6px;overflow:hidden;box-sizing:border-box;border-radius:8px 8px 14px 14px;border:1px solid rgba(255,255,255,.05);background:linear-gradient(180deg,#587a6a1c,#2e4c3e42 18%,#121c188f 60%,#080d0bd1),#0a100d70;box-shadow:0 10px 22px #0000001f,inset 0 1px #ffffff13,inset 0 0 0 1px #ffffff03;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]>*{position:relative;z-index:1}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]:before{content:none}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]:after{content:none}.studio-catalog-cover-media[data-v-8c1ef0cd]{width:100%;height:100%}.studio-catalog-cover-fallback[data-v-8c1ef0cd]{width:100%;height:100%;display:grid;place-items:center;color:var(--studio-green);font-weight:800}.studio-catalog-cover-fallback-img[data-v-8c1ef0cd]{width:100%;height:100%;display:block;object-fit:cover}.studio-catalog-card:hover .studio-catalog-cover[data-v-8c1ef0cd]{transform:translateY(-2px) scale(1.015);filter:saturate(1.12) brightness(1.06);box-shadow:0 16px 44px #58d46a1c}.studio-catalog-card:hover .studio-catalog-cover[data-v-8c1ef0cd] .fade-image-img{transform:scale(1.055)}.studio-catalog-badges[data-v-8c1ef0cd]{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}.studio-catalog-badges span[data-v-8c1ef0cd]{padding:4px 8px;border-radius:999px;color:#e6f7e8e0;background:#ffffff12;font-size:10px;font-weight:700;line-height:1}.studio-catalog-copy strong[data-v-8c1ef0cd]{display:-webkit-box;min-width:0;min-height:44px;overflow:hidden;color:var(--studio-text);font-size:15px;font-weight:800;line-height:1.45;text-wrap:pretty;-webkit-line-clamp:2;-webkit-box-orient:vertical}.studio-catalog-card.is-course-cover .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:54px;font-size:20px;line-height:1.32;-webkit-line-clamp:2}.studio-catalog-card.is-course-compact .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:22px;font-size:16px;line-height:1.3;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:unset}.studio-catalog-card.is-poster .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:42px;-webkit-line-clamp:2}.studio-catalog-card.is-course-poster .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:44px;font-size:17px;line-height:1.34;-webkit-line-clamp:2}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:66px;font-size:20px;line-height:1.16;letter-spacing:-.02em;-webkit-line-clamp:3}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-copy strong[data-v-8c1ef0cd]{display:block;min-height:0;font-size:16px;line-height:1.24;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}.studio-catalog-copy small[data-v-8c1ef0cd]{display:-webkit-box;min-height:36px;margin-top:8px;overflow:hidden;color:var(--studio-muted);font-size:11px;line-height:1.5;-webkit-line-clamp:2;-webkit-box-orient:vertical}.studio-catalog-card.is-course-cover .studio-catalog-copy small[data-v-8c1ef0cd]{min-height:18px;margin-top:0;color:#d6e5d8b3;font-size:12px;-webkit-line-clamp:1}.studio-catalog-card.is-course-compact .studio-catalog-copy small[data-v-8c1ef0cd]{min-height:32px;margin-top:0;color:#d6e5d8bd;font-size:11px;line-height:1.45;-webkit-line-clamp:2}.studio-catalog-card.is-course-poster .studio-catalog-copy small[data-v-8c1ef0cd]{min-height:18px;margin-top:0;color:#dfebe1c2;font-size:11px;line-height:1.5;-webkit-line-clamp:1}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-copy small[data-v-8c1ef0cd]{color:#f4e6c9b8}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-copy small[data-v-8c1ef0cd]{color:#d7efdfc2;font-size:10px;min-height:0;line-height:1.2}.studio-catalog-meta[data-v-8c1ef0cd]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}.studio-catalog-card.is-course-cover .studio-catalog-meta[data-v-8c1ef0cd]{grid-template-columns:repeat(2,minmax(0,1fr));align-self:end}.studio-catalog-card.is-course-poster .studio-catalog-meta[data-v-8c1ef0cd]{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:2px}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-meta[data-v-8c1ef0cd]{gap:6px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-meta[data-v-8c1ef0cd]{grid-template-columns:1fr;gap:6px}.studio-catalog-editorial-meta[data-v-8c1ef0cd]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:6px}.studio-catalog-editorial-meta span[data-v-8c1ef0cd]{display:flex;align-items:center;justify-content:center;gap:4px;min-height:26px;padding:4px 8px;border:1px solid rgba(255,255,255,.055);border-radius:999px;background:#ffffff09;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);text-align:center}.studio-catalog-editorial-meta b[data-v-8c1ef0cd]{display:block;color:var(--studio-text);font-size:11px;line-height:1.1;white-space:nowrap}.studio-catalog-editorial-meta em[data-v-8c1ef0cd]{display:block;color:#d7efdfad;font-size:9px;font-style:normal;line-height:1.1;white-space:nowrap}@container (max-width: 320px){.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]{padding:10px 12px 13px;gap:5px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-copy strong[data-v-8c1ef0cd]{font-size:15px}.studio-catalog-editorial-meta[data-v-8c1ef0cd]{gap:5px;margin-top:5px}.studio-catalog-editorial-meta span[data-v-8c1ef0cd]{min-height:23px;padding:3px 6px;gap:3px}.studio-catalog-editorial-meta b[data-v-8c1ef0cd]{font-size:10px}.studio-catalog-editorial-meta em[data-v-8c1ef0cd]{font-size:8px}}@container (max-width: 292px){.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]{padding:9px 11px 13px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-copy strong[data-v-8c1ef0cd]{font-size:14px}.studio-catalog-editorial-meta span[data-v-8c1ef0cd]{min-height:22px;padding:2px 5px}.studio-catalog-editorial-meta b[data-v-8c1ef0cd]{font-size:9px}.studio-catalog-editorial-meta em[data-v-8c1ef0cd]{font-size:7px}}.studio-catalog-meta div[data-v-8c1ef0cd]{padding:8px 10px;border:1px solid rgba(255,255,255,.06);border-radius:14px;background:#ffffff08}.studio-catalog-card.is-course-compact .studio-catalog-meta div[data-v-8c1ef0cd]{padding:8px 10px;background:#ffffff0b;border-radius:12px}.studio-catalog-card.is-course-compact .studio-catalog-meta[data-v-8c1ef0cd]{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:auto;padding-top:8px;align-self:end}.studio-catalog-card.is-course-compact .studio-catalog-meta span[data-v-8c1ef0cd]{font-size:9px;white-space:nowrap}.studio-catalog-card.is-course-compact .studio-catalog-meta b[data-v-8c1ef0cd]{margin-top:3px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.studio-catalog-card.is-course-poster .studio-catalog-meta div[data-v-8c1ef0cd]{padding:8px 10px;border-color:#ffffff14;background:#ffffff08;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-meta div[data-v-8c1ef0cd]{background:#ffd6800d;border-color:#ffd6801f}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-meta div[data-v-8c1ef0cd]{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;background:#ffffff05}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-meta div span[data-v-8c1ef0cd],.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-meta div b[data-v-8c1ef0cd]{margin:0}.studio-catalog-card.is-course-cover .studio-catalog-meta div[data-v-8c1ef0cd]:last-child:nth-child(odd){grid-column:1 / -1}.studio-catalog-meta span[data-v-8c1ef0cd]{display:block;color:var(--studio-muted);font-size:10px;line-height:1.2}.studio-catalog-meta b[data-v-8c1ef0cd]{display:block;margin-top:4px;color:var(--studio-text);font-size:12px;line-height:1.3}.studio-catalog-foot[data-v-8c1ef0cd]{display:flex;align-items:center;justify-content:flex-end;margin-top:12px}.studio-catalog-card.is-course-cover .studio-catalog-foot[data-v-8c1ef0cd]{margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06)}.studio-catalog-card.is-course-compact .studio-catalog-foot[data-v-8c1ef0cd],.studio-catalog-card.is-course-poster .studio-catalog-foot[data-v-8c1ef0cd]{margin-top:4px;padding-top:8px;border-top:1px solid rgba(255,255,255,.06)}.studio-catalog-card.is-course-compact .studio-catalog-foot[data-v-8c1ef0cd]{display:none}.studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-foot em[data-v-8c1ef0cd]{color:#ffe7b3;letter-spacing:.08em}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-foot[data-v-8c1ef0cd]{border-top:0;margin-top:0;padding-top:0}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-foot em[data-v-8c1ef0cd]{font-size:10px;color:#dcffd2e6;letter-spacing:.02em}.studio-catalog-foot em[data-v-8c1ef0cd]{color:#dcffd2;font-size:11px;font-style:normal;font-weight:800;letter-spacing:.04em}@media(max-width:720px){.studio-catalog-card.is-course-poster[data-v-8c1ef0cd]{padding:12px}.studio-catalog-card.is-course-poster .studio-catalog-cover[data-v-8c1ef0cd]{width:min(70%,160px)}.studio-catalog-card.is-course-poster .studio-catalog-copy strong[data-v-8c1ef0cd]{min-height:40px;font-size:16px}.studio-catalog-card.is-course-poster .studio-catalog-copy small[data-v-8c1ef0cd]{font-size:11px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-cover[data-v-8c1ef0cd]{width:100%;height:79%}.studio-catalog-card.is-course-compact .studio-catalog-copy strong[data-v-8c1ef0cd]{font-size:15px}.studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]{left:12px;right:12px;bottom:10px;height:35%}.studio-catalog-editorial-meta[data-v-8c1ef0cd],.studio-catalog-meta[data-v-8c1ef0cd],.studio-catalog-card.is-course-compact .studio-catalog-meta[data-v-8c1ef0cd]{grid-template-columns:1fr}}html.light .studio-catalog-card[data-v-8c1ef0cd]{border-color:#0f172a14;background:#fff;box-shadow:0 2px 10px #0f172a0a}html.light .studio-catalog-card.is-course-compact[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial[data-v-8c1ef0cd]{border-color:#0f172a14;background:linear-gradient(180deg,#fffffff5,#f8fafce6),#fff}html.light .studio-catalog-card[data-v-8c1ef0cd]:hover{border-color:#0f8f832e;background:#fff;box-shadow:0 8px 22px #0f172a12,0 0 0 1px #0f8f830d}html.light .studio-catalog-card[data-v-8c1ef0cd]:after{background:linear-gradient(110deg,transparent 0 34%,rgba(15,143,131,.08) 50%,transparent 68% 100%)}html.light .studio-catalog-card[data-tooltip]:before,.light .studio-catalog-card[data-tooltip]:before{color:#0f172a;border-color:#0f172a1a;background:#fffffffa;box-shadow:0 10px 28px #0f172a1f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}html.light .studio-catalog-cover[data-v-8c1ef0cd]{color:#0f8f83;background:linear-gradient(135deg,#0f8f8324,#0ea5e91a);box-shadow:inset 0 0 0 1px #0f172a0a}html.light .studio-catalog-card:hover .studio-catalog-cover[data-v-8c1ef0cd]{filter:saturate(1.03) brightness(1.01);box-shadow:0 8px 18px #0f8f8314}html.light .studio-catalog-cover-fallback[data-v-8c1ef0cd],html.light .studio-catalog-cover>span[data-v-8c1ef0cd]{color:#0f8f83}html.light .studio-catalog-badges span[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-cover .studio-catalog-badges span[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster .studio-catalog-badges span[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-badges span[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-badges span[data-v-8c1ef0cd]{color:#0f766e;border:1px solid rgba(15,143,131,.12);background:#0f8f8314;-webkit-backdrop-filter:none;backdrop-filter:none}html.light .studio-catalog-copy strong[data-v-8c1ef0cd],html.light .studio-catalog-editorial-meta b[data-v-8c1ef0cd],html.light .studio-catalog-meta b[data-v-8c1ef0cd]{color:#0f172a}html.light .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-cover .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-compact .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-copy small[data-v-8c1ef0cd],html.light .studio-catalog-meta span[data-v-8c1ef0cd],html.light .studio-catalog-editorial-meta em[data-v-8c1ef0cd]{color:#0f172a8f}html.light .studio-catalog-meta div[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-compact .studio-catalog-meta div[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster .studio-catalog-meta div[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-meta div[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-meta div[data-v-8c1ef0cd],html.light .studio-catalog-editorial-meta span[data-v-8c1ef0cd]{border-color:#0f172a14;background:#f8fafceb;-webkit-backdrop-filter:none;backdrop-filter:none}html.light .studio-catalog-poster-panel[data-v-8c1ef0cd],html.light .studio-catalog-poster-panel.is-cinematic[data-v-8c1ef0cd],html.light .studio-catalog-poster-panel.is-editorial[data-v-8c1ef0cd]{border-color:#0f172a14;background:#ffffffe0;box-shadow:0 6px 18px #0f172a14;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-poster-panel[data-v-8c1ef0cd]{border-color:#0f172a14;background:linear-gradient(180deg,#ffffffe6,#f8fafcf5),#ffffffe6;box-shadow:0 8px 20px #0f172a1a,inset 0 1px #ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}html.light .studio-catalog-card[data-tooltip]:before,.light .studio-catalog-card[data-tooltip]:before{content:none!important;display:none!important;opacity:0!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}html.light .studio-catalog-card[data-tooltip]:hover:before,.light .studio-catalog-card[data-tooltip]:hover:before{content:none!important;display:none!important;opacity:0!important;transform:none!important}html.light .studio-catalog-card.is-course-cover .studio-catalog-foot[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-compact .studio-catalog-foot[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster .studio-catalog-foot[data-v-8c1ef0cd]{border-top-color:#0f172a14}html.light .studio-catalog-foot em[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-cinematic .studio-catalog-foot em[data-v-8c1ef0cd],html.light .studio-catalog-card.is-course-poster.is-course-poster-editorial .studio-catalog-foot em[data-v-8c1ef0cd]{color:#0f8f83}@keyframes studioCardSweep-8c1ef0cd{to{transform:translate(130%)}}.studio-course-agent-access[data-v-b0d979d5]{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px;padding:14px 16px;border:1px solid var(--studio-line);border-radius:14px;background:var(--studio-panel)}.studio-course-agent-access>div[data-v-b0d979d5]{display:flex;flex-direction:column;gap:4px}.studio-course-agent-access span[data-v-b0d979d5]{color:var(--studio-green);font-weight:700}.studio-course-learning-meta[data-v-b0d979d5],.studio-course-card-meta[data-v-b0d979d5]{display:flex;align-items:center;gap:8px}.studio-course-type-tabs[data-v-b0d979d5]{display:grid;grid-template-columns:1fr;gap:6px;margin-top:4px;padding-top:12px;border-top:1px solid var(--studio-line)}.studio-course-type-tabs button[data-v-b0d979d5]{width:100%;min-height:34px;display:flex;align-items:center;justify-content:center;border:1px solid var(--studio-line);border-radius:8px;background:transparent;color:var(--studio-text-muted);cursor:pointer;font:inherit;padding:0 10px;white-space:nowrap;transition:border-color .18s ease,background .18s ease,color .18s ease}.studio-course-type-tabs button.is-active[data-v-b0d979d5]{border-color:var(--studio-green);background:color-mix(in srgb,var(--studio-green) 14%,transparent);color:var(--studio-text)}.studio-course-type-tabs button[data-v-b0d979d5]:hover:not(.is-active){border-color:color-mix(in srgb,var(--studio-green) 28%,var(--studio-line));background:color-mix(in srgb,var(--studio-green) 7%,transparent);color:var(--studio-text)}.studio-course-search[data-v-b0d979d5]{display:flex;align-items:center;gap:10px;margin-bottom:16px;color:var(--studio-text-muted);font-size:13px}.studio-course-search input[data-v-b0d979d5]{min-width:0;flex:1;border:1px solid var(--studio-line);border-radius:10px;background:var(--studio-panel);color:var(--studio-text);outline:none;padding:10px 12px}.studio-course-search input[data-v-b0d979d5]:focus{border-color:var(--studio-green)}.studio-course-learning-meta[data-v-b0d979d5]{flex-wrap:wrap;margin-bottom:12px;color:var(--studio-text-muted);font-size:12px}.studio-course-learning-meta span[data-v-b0d979d5],.studio-course-card-meta span[data-v-b0d979d5]{border-radius:999px;background:var(--studio-panel);padding:4px 8px}.studio-course-card-meta[data-v-b0d979d5]{justify-content:space-between;margin:0 2px 8px;color:var(--studio-text-muted);font-size:12px}.studio-course-card-meta strong[data-v-b0d979d5]{color:var(--studio-green);font-size:13px}.studio-course-card-meta .is-agent[data-v-b0d979d5]{color:var(--studio-purple, var(--studio-text))}.studio-course-card-meta .is-creator[data-v-b0d979d5]{color:var(--studio-orange, var(--studio-text))}.studio-course-complete-btn[data-v-b0d979d5]{margin-top:10px;border:1px solid var(--studio-green);border-radius:9px;background:transparent;color:var(--studio-green);cursor:pointer;font:inherit;padding:7px 10px}.studio-course-complete-btn.is-completed[data-v-b0d979d5]{cursor:default;opacity:.7}@media(max-width:720px){.studio-course-agent-access[data-v-b0d979d5]{align-items:stretch;flex-direction:column}.studio-course-type-tabs[data-v-b0d979d5]{width:100%;grid-template-columns:repeat(3,minmax(0,1fr))}.studio-course-type-tabs button[data-v-b0d979d5]{justify-content:center}}
/* SANDO styles compiled into the route */
/* SANDO colors follow the existing html.dark / html.light theme switch. */
html.dark .home-page.home-page[data-v-329e3f7c] {
--sando-bg: #0d291f;
--sando-header: rgba(12, 39, 30, .9);
--sando-text: #e5f3df;
--sando-subtle: #b7d3bb;
--sando-muted: #9abb9e;
--sando-accent: #c8dc7b;
--sando-action: #b8dc86;
--sando-action-text: #153524;
--sando-border: rgba(189, 224, 177, .24);
--sando-secondary: rgba(21, 65, 46, .68);
--sando-photo-overlay: linear-gradient(90deg, rgba(10, 39, 29, .94) 0%, rgba(10, 39, 29, .82) 42%, rgba(10, 39, 29, .3) 100%), linear-gradient(0deg, #0d291f 0%, transparent 36%);
}
html.light .home-page.home-page[data-v-329e3f7c] {
--sando-bg: #dcecd5;
--sando-header: rgba(221, 239, 212, .94);
--sando-text: #183f2c;
--sando-subtle: #315a40;
--sando-muted: #4c7053;
--sando-accent: #526f1f;
--sando-action: #2f6843;
--sando-action-text: #eff7dc;
--sando-border: rgba(43, 100, 61, .28);
--sando-secondary: rgba(230, 245, 218, .8);
--sando-photo-overlay: linear-gradient(90deg, rgba(224, 242, 211, .96) 0%, rgba(224, 242, 211, .84) 43%, rgba(224, 242, 211, .3) 100%), linear-gradient(0deg, #dcecd5 0%, transparent 36%);
}
.home-page.home-page[data-v-329e3f7c] {
position: relative;
z-index: 1;
color: var(--sando-text);
background: var(--sando-bg);
font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
}
.home-page .content-layer[data-v-329e3f7c] {
position: relative;
z-index: 2;
background: var(--sando-bg);
}
.home-page.home-page[data-v-329e3f7c]::before {
inset: 0 0 auto;
height: min(80svh, 780px);
background-image: var(--sando-photo-overlay), url("/sando-build/21ac4e2a59fda76f/assets/sando-workbench.png");
background-size: cover;
background-position: center, center 45%;
mask-image: none;
-webkit-mask-image: none;
}
.home-page .background-stage[data-v-329e3f7c],
.home-page .hero-visual[data-v-329e3f7c],
.home-page .hero-orb[data-v-329e3f7c] {
display: none;
}
.home-page > canvas[data-v-329e3f7c] {
display: none;
}
.home-page .content-layer[data-v-329e3f7c] {
padding-top: 76px;
}
.home-page .home-corner-chrome[data-v-329e3f7c]::before {
content: "";
position: fixed;
inset: 0 0 auto;
height: 70px;
background: var(--sando-header);
border-bottom: 1px solid var(--sando-border);
backdrop-filter: blur(16px);
}
.home-page .top-brand[data-v-329e3f7c] {
top: 12px;
left: 28px;
gap: 12px;
}
.home-page .brand-logo[data-v-329e3f7c] {
width: 44px;
height: 44px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}
.home-page .brand-logo[data-v-329e3f7c] img {
width: 100%;
height: 100%;
object-fit: contain;
}
.home-page .brand-name[data-v-329e3f7c] {
color: var(--sando-text);
font-size: 15px;
font-weight: 700;
letter-spacing: 0;
}
.home-page .top-start-btn[data-v-329e3f7c] {
top: 15px;
right: 28px;
min-height: 40px;
border: 1px solid var(--sando-action);
border-radius: 6px;
background: var(--sando-action);
color: var(--sando-action-text);
box-shadow: none;
}
.home-page .top-start-btn[data-v-329e3f7c]:hover {
filter: brightness(1.1);
box-shadow: 0 8px 26px rgba(10, 44, 25, .18);
}
.home-page .hero[data-v-329e3f7c] {
box-sizing: border-box;
width: min(1360px, 100%);
padding: 0 56px 40px;
grid-template-rows: minmax(580px, 73svh) auto;
gap: 0;
}
.home-page .hero-copy[data-v-329e3f7c] {
box-sizing: border-box;
width: 100%;
max-width: 790px;
margin: 0;
padding: 36px 0 20px;
align-self: center;
justify-items: start;
text-align: left;
gap: 14px;
}
.home-page .hero-copy[data-v-329e3f7c] > * {
animation: none;
}
.home-page .badge[data-v-329e3f7c] {
min-height: 0;
padding: 0 0 0 12px;
border: 0;
border-left: 2px solid var(--sando-accent);
border-radius: 0;
background: none;
color: var(--sando-accent);
box-shadow: none;
font-size: 12px;
letter-spacing: 0;
}
.home-page .hero-title[data-v-329e3f7c] {
display: block;
max-width: 790px;
color: var(--sando-text);
font-size: 4.6rem;
font-weight: 720;
line-height: 1.08;
letter-spacing: 0;
white-space: normal;
text-wrap: balance;
}
.home-page .hero-title[data-v-329e3f7c] span {
display: inline;
margin-right: .18em;
font-weight: 720;
letter-spacing: 0;
}
.home-page .hero-title .tone-dark[data-v-329e3f7c],
.home-page .hero-title .tone-warm[data-v-329e3f7c] {
color: var(--sando-text);
}
.home-page .hero-title .tone-mint[data-v-329e3f7c] {
color: var(--sando-accent);
}
.home-page .hero-creative-title[data-v-329e3f7c] {
margin: 12px 0 0;
color: var(--sando-text);
font-size: 2.15rem;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0;
white-space: normal;
}
.home-page .hero-creative-sub[data-v-329e3f7c],
.home-page .hero-creative-sub-secondary[data-v-329e3f7c] {
max-width: 650px;
margin: 0;
color: var(--sando-subtle);
font-size: 1rem;
font-weight: 400;
line-height: 1.7;
letter-spacing: 0;
text-align: left;
white-space: normal;
}
.home-page .hero-creative-sub-secondary[data-v-329e3f7c] {
color: var(--sando-muted);
}
.home-page .hero-actions[data-v-329e3f7c] {
justify-content: flex-start;
margin-top: 22px;
}
.home-page .btn-primary[data-v-329e3f7c],
.home-page .btn-secondary[data-v-329e3f7c] {
min-height: 48px;
padding: 0 23px;
border-radius: 6px;
font-weight: 650;
box-shadow: none;
}
.home-page .btn-primary[data-v-329e3f7c] {
background: var(--sando-action);
color: var(--sando-action-text);
}
.home-page .btn-secondary[data-v-329e3f7c] {
border: 1px solid var(--sando-border);
background: var(--sando-secondary);
color: var(--sando-text);
}
.home-page .btn-primary[data-v-329e3f7c]:hover,
.home-page .btn-secondary[data-v-329e3f7c]:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(10, 44, 25, .2);
}
.home-page .value-strip[data-v-329e3f7c] {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0;
margin-top: 0;
border-top: 1px solid var(--sando-border);
}
.home-page .value-card[data-v-329e3f7c] {
min-height: 175px;
padding: 25px 28px 22px 0;
border: 0;
border-radius: 0;
background: none;
box-shadow: none;
backdrop-filter: none;
animation: none;
transform: none;
}
.home-page .value-card[data-v-329e3f7c] + .value-card[data-v-329e3f7c] {
padding-left: 28px;
border-left: 1px solid var(--sando-border);
}
.home-page .value-card[data-v-329e3f7c]::before,
.home-page .value-card[data-v-329e3f7c]::after {
display: none;
}
.home-page .value-card[data-v-329e3f7c]:hover {
transform: none;
background: none;
border-color: var(--sando-border);
box-shadow: none;
}
.home-page .value-card-eyebrow[data-v-329e3f7c] {
min-height: 0;
padding: 0;
border: 0;
border-radius: 0;
background: none;
color: var(--sando-accent);
box-shadow: none;
letter-spacing: 0;
}
.home-page .value-card h3[data-v-329e3f7c],
.home-page .value-card:hover h3[data-v-329e3f7c] {
margin: 12px 0 9px;
color: var(--sando-text);
font-size: 1.27rem;
font-weight: 650;
letter-spacing: 0;
transform: none;
}
.home-page .value-card p[data-v-329e3f7c],
.home-page .value-card:hover p[data-v-329e3f7c] {
color: var(--sando-subtle);
font-size: .93rem;
transform: none;
}
.home-page .home-footer[data-v-329e3f7c] {
color: var(--sando-muted);
border-top: 1px solid var(--sando-border);
}
.home-page .fab[data-v-329e3f7c] {
border: 1px solid var(--sando-border);
border-radius: 6px;
background: var(--sando-action);
color: var(--sando-action-text);
box-shadow: 0 10px 28px rgba(10, 44, 25, .2);
}
html.dark .app-shell.app-shell {
--studio-bg: #102b20;
--studio-rail: #153727;
--studio-panel: #1a3d2c;
--studio-panel-2: #204734;
--studio-line: rgba(191, 224, 174, .18);
--studio-line-strong: rgba(182, 219, 118, .46);
--studio-text: #e4f1de;
--studio-muted: #a7c4a8;
--studio-soft: #cee0c4;
--studio-green: #bbdb7e;
--studio-green-light: #d5eaa0;
--studio-green-rgb: 187, 219, 126;
--studio-aqua: #92cf9b;
--studio-blue: #aecf95;
--sando-topbar: rgba(17, 48, 33, .97);
--sando-active-text: #173923;
--sando-prompt: #1a3b2c;
background: var(--studio-bg);
color: var(--studio-text);
}
html.light .app-shell.app-shell {
--studio-bg: #e3f0dc;
--studio-rail: #d4e9d0;
--studio-panel: #eef7e6;
--studio-panel-2: #dcebd5;
--studio-line: rgba(42, 96, 55, .19);
--studio-line-strong: rgba(44, 106, 57, .4);
--studio-text: #183c28;
--studio-muted: #4b6e51;
--studio-soft: #315a3b;
--studio-green: #2e7043;
--studio-green-light: #3c8652;
--studio-green-rgb: 46, 112, 67;
--studio-aqua: #3b8060;
--studio-blue: #426e55;
--sando-topbar: rgba(221, 239, 215, .98);
--sando-active-text: #f1f8e9;
--sando-prompt: #f1f8e9;
background: var(--studio-bg);
color: var(--studio-text);
}
html .app-shell .studio-main.studio-main {
background: var(--studio-bg);
color: var(--studio-text);
}
html .app-shell .studio-topbar.studio-topbar {
border-bottom: 1px solid var(--studio-line);
background: var(--sando-topbar);
color: var(--studio-text);
}
html .app-shell .studio-rail.studio-rail {
border-right: 1px solid var(--studio-line);
background: var(--studio-rail);
color: var(--studio-text);
}
html .app-shell .studio-theme-toggle.studio-theme-toggle {
border-color: var(--studio-line-strong);
background: var(--studio-panel);
color: var(--studio-text);
}
html.light .app-shell.app-shell:has(.studio-chat-workspace) {
background: var(--studio-bg) !important;
}
html.light .app-shell:has(.studio-chat-workspace) > .studio-shell.studio-shell,
html.light .app-shell:has(.studio-chat-workspace) .studio-main.studio-main,
html.light .app-shell:has(.studio-chat-workspace) .studio-stage.studio-stage {
background: var(--studio-bg) !important;
}
/* 注意：工具工位内部还有一个同名的 div.studio-shell.panel 包装层，
这里必须用直接子选择器（>），否则会把工位内部的 flex 布局也改成 block，
导致工位面板被撑高、底部按钮挤出屏幕。 */
html .app-shell > .studio-shell.studio-shell,
html .app-shell .studio-stage.studio-stage,
html .app-shell .studio-canvas.studio-canvas {
background: var(--studio-bg) !important;
}
html .app-shell .studio-main.studio-main,
html .app-shell .studio-stage.studio-stage {
background: var(--studio-bg) !important;
}
html.light .app-shell .studio-canvas:has(.studio-chat-workspace) {
background: var(--studio-bg) !important;
}
html .app-shell .studio-assist.studio-assist {
border-color: var(--studio-line);
background: var(--studio-panel) !important;
color: var(--studio-text);
}
html .app-shell .studio-center-composer.studio-center-composer {
border-color: var(--studio-line-strong);
background: var(--studio-panel) !important;
color: var(--studio-text);
}
html .app-shell .studio-center-input.studio-center-input {
color: var(--studio-text);
}
html .app-shell .studio-center-input.studio-center-input::placeholder {
color: var(--studio-muted);
}
html.light .app-shell .studio-rail-bottom[data-v-f522b144] {
background: linear-gradient(180deg, transparent, var(--studio-rail) 36%);
}
.app-shell .studio-brand.studio-brand,
.app-shell .studio-rail-btn span[data-v-f522b144] {
border-radius: 6px;
}
/* SANDO desktop navigation: keep the brand and workspace actions in one top row. */
html .app-shell > .studio-shell.studio-shell {
display: block !important;
width: 100vw;
height: 100vh;
overflow: hidden;
}
html .app-shell .studio-rail.studio-rail {
position: sticky;
top: 0;
z-index: 150;
width: 100%;
height: 80px;
min-height: 80px;
box-sizing: border-box;
padding: 9px 18px;
flex-direction: row;
align-items: center;
justify-content: flex-start;
gap: 5px;
overflow-x: auto;
overflow-y: hidden;
border-right: 0;
border-bottom: 1px solid var(--studio-line);
background:
linear-gradient(100deg, rgba(var(--studio-green-rgb), .16), transparent 34%),
linear-gradient(180deg, var(--studio-rail), color-mix(in srgb, var(--studio-rail) 88%, transparent));
box-shadow: 0 8px 28px rgba(4, 21, 12, .16);
scrollbar-width: none;
}
/* The rail component hides its original brand on this route; rebuild it as the
first flex items so the Logo, name, and menu share one line. */
html .app-shell .studio-rail.studio-rail::before {
content: "SANDO AI Platform";
width: 194px;
height: 44px;
flex: 0 0 194px;
display: block;
box-sizing: border-box;
border: 0;
border-radius: 0;
padding: 0 8px 0 47px;
color: var(--studio-text);
white-space: nowrap;
font-size: 15px;
font-weight: 850;
line-height: 44px;
background: transparent url("/api/media/sando-logo.png") 8px center / 33px 33px no-repeat;
box-shadow: none;
}
html .app-shell .studio-rail.studio-rail::after {
display: none;
}
html .app-shell .studio-rail.studio-rail::-webkit-scrollbar {
display: none;
}
html .app-shell .studio-brand.studio-brand {
width: auto;
min-width: 194px;
height: 44px;
flex: 0 0 auto;
margin: 0 6px 0 0;
padding: 0 8px 0 4px;
display: inline-flex;
align-items: center;
justify-content: flex-start;
gap: 9px;
border: 0;
border-radius: 0;
background: transparent;
color: var(--studio-text);
box-shadow: none;
}
html .app-shell .studio-brand.studio-brand::before {
content: "SANDO AI Platform";
order: 2;
white-space: nowrap;
font-size: 15px;
font-weight: 850;
letter-spacing: .01em;
}
html .app-shell .studio-brand.studio-brand img {
order: 1;
width: 37px;
height: 37px;
flex: 0 0 37px;
object-fit: contain;
padding: 0;
box-sizing: border-box;
border-radius: 0;
background: transparent;
}
html .app-shell .studio-rail-btn.studio-rail-btn {
width: auto;
min-width: 64px;
min-height: 48px;
height: 48px;
flex: 0 0 auto;
grid-template-columns: 28px auto;
grid-template-rows: 1fr;
gap: 6px;
padding: 0 8px;
border-radius: 11px;
font-size: 13px;
font-weight: 600;
}
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 28px;
height: 28px;
border-radius: 9px;
}
/* SANDO icon set: compact geometric marks distinct from the source site's
original line illustrations. */
html .app-shell .studio-rail-btn .studio-rail-ico svg {
display: none;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
display: block;
content: "";
width: 17px;
height: 17px;
background-color: currentColor;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-size: 17px 17px;
mask-size: 17px 17px;
}
/* One vector family keeps every menu icon at the same optical weight as the
13px labels: 24px grid, 1.9 stroke, rounded joins. */
html .app-shell .studio-rail-btn:nth-of-type(1) .studio-rail-ico::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,");
mask-image: url("data:image/svg+xml;utf8,");
}
html .app-shell .studio-rail-btn:nth-of-type(2) .studio-rail-ico::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,");
mask-image: url("data:image/svg+xml;utf8,");
}
html .app-shell .studio-rail-btn:nth-of-type(3) .studio-rail-ico::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,");
mask-image: url("data:image/svg+xml;utf8,");
}
html .app-shell .studio-rail-btn:nth-of-type(4) .studio-rail-ico::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,");
mask-image: url("data:image/svg+xml;utf8,");
}
html .app-shell .studio-rail-btn:nth-of-type(5) .studio-rail-ico::before {
-webkit-mask-image: url("data:image/svg+xml;utf8,");
mask-image: url("data:image/svg+xml;utf8,");
}
html .app-shell .studio-rail-btn.studio-rail-btn b[data-v-f522b144] {
white-space: nowrap;
font-size: 13px;
font-weight: 700;
letter-spacing: .01em;
}
html .app-shell .studio-codex-btn.studio-codex-btn {
display: none !important;
}
html .app-shell .studio-rail-bottom.studio-rail-bottom {
margin: 0;
padding: 0;
display: flex;
align-items: center;
gap: 5px;
background: none;
}
html .app-shell .studio-main.studio-main {
height: calc(100vh - 80px);
min-height: 0;
grid-template-rows: 0 minmax(0, 1fr);
grid-template-areas: "topbar" "stage";
}
html .app-shell .studio-topbar-brand.studio-topbar-brand {
display: none;
}
html .app-shell .studio-topbar.studio-topbar {
position: fixed;
top: 0;
right: 0;
z-index: 151;
width: auto;
max-width: min(100vw, 860px);
height: 80px;
min-height: 80px;
box-sizing: border-box;
padding: 10px 18px;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 12px;
overflow: visible;
border: 0;
background: transparent;
pointer-events: none;
-webkit-backdrop-filter: none;
backdrop-filter: none;
}
html .app-shell .studio-topbar .studio-top-right {
min-width: 0;
margin-left: 0;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 9px;
overflow: visible;
pointer-events: auto;
}
html .app-shell .studio-announcement,
html .app-shell .studio-support-fab,
html .app-shell .studio-topbar-promo {
font-size: 13px;
}
html .app-shell .studio-support-fab {
min-height: 40px;
padding-inline: 12px;
gap: 7px;
background: rgba(var(--studio-green-rgb), .14);
border-color: rgba(var(--studio-green-rgb), .30);
color: var(--studio-text);
}
html .app-shell .studio-announcement {
width: 230px;
flex-basis: 230px;
height: 38px;
background: rgba(var(--studio-green-rgb), .10);
border-color: rgba(var(--studio-green-rgb), .24);
color: var(--studio-text);
}
html .app-shell .studio-theme-toggle.studio-theme-toggle {
width: 38px;
height: 38px;
flex: 0 0 38px;
border-radius: 50%;
}
html .app-shell .studio-announcement-label {
min-height: 18px;
padding: 0 7px;
border-radius: 6px;
background: rgba(var(--studio-green-rgb), .18);
color: var(--studio-green);
line-height: 18px;
}
html .app-shell .studio-announcement-title {
color: var(--studio-text);
}
html .app-shell .studio-topbar .studio-theme-toggle,
html .app-shell .studio-topbar .studio-announcement,
html .app-shell .studio-topbar .studio-support-fab,
html .app-shell .studio-topbar .studio-topbar-promo {
pointer-events: auto;
}
/* Reserve room for the fixed controls while keeping the left navigation in
the same horizontal row. */
@media (min-width: 1101px) {
html .app-shell .studio-rail.studio-rail {
padding-right: min(860px, 60vw);
}
html .app-shell .studio-topbar-promo {
flex: 0 1 320px;
width: min(320px, 28vw);
height: 40px;
margin: 0 4px;
}
html .app-shell .studio-topbar-promo-box,
html .app-shell .studio-topbar-promo-open,
html .app-shell .studio-topbar-promo-frame,
html .app-shell .studio-topbar-promo-img {
width: min(320px, 28vw);
height: 40px;
}
}
@media (max-width: 1100px) {
html .app-shell .studio-topbar.studio-topbar {
max-width: 100vw;
padding-right: 10px;
}
html .app-shell .studio-topbar .studio-announcement {
width: min(248px, 34vw);
flex-basis: min(248px, 34vw);
}
}
@media (max-width: 920px) {
html .app-shell .studio-topbar.studio-topbar {
height: 76px;
min-height: 76px;
padding: 8px 10px;
gap: 4px;
}
html .app-shell .studio-rail.studio-rail {
height: 76px;
min-height: 76px;
padding: 8px 10px;
}
html .app-shell .studio-rail.studio-rail::before {
width: 174px;
height: 40px;
flex-basis: 174px;
padding-left: 41px;
font-size: 14px;
line-height: 40px;
background-size: 29px 29px;
background-position: 7px center;
}
html .app-shell .studio-rail.studio-rail::after {
display: none;
}
html .app-shell .studio-brand.studio-brand {
min-width: 46px;
width: 46px;
height: 44px;
margin-right: 2px;
padding: 0;
justify-content: center;
}
html .app-shell .studio-brand.studio-brand::before {
display: none;
}
html .app-shell .studio-brand.studio-brand img {
width: 37px;
height: 37px;
}
html .app-shell .studio-rail-btn.studio-rail-btn {
min-width: 62px;
width: 62px;
height: 54px;
padding: 0 6px;
grid-template-columns: 1fr;
grid-template-rows: 30px auto;
gap: 4px;
font-size: 12px;
}
html .app-shell .studio-main.studio-main {
height: calc(100vh - 76px);
grid-template-rows: 0 minmax(0, 1fr);
grid-template-areas: "topbar" "stage";
}
}
@media (max-width: 720px) {
html .app-shell .studio-topbar .studio-announcement {
display: none;
}
html .app-shell .studio-topbar .studio-support-fab {
min-height: 38px;
padding-inline: 11px;
font-size: 13px;
}
}
html .app-shell .studio-rail-btn.is-active span[data-v-f522b144] {
border-color: var(--studio-line-strong);
background: var(--studio-green);
color: var(--sando-active-text);
box-shadow: none;
}
html .app-shell .studio-chat-welcome.studio-chat-welcome {
border-radius: 8px;
background: var(--studio-panel);
color: var(--studio-text);
box-shadow: none;
}
.app-shell .studio-command-mode.studio-command-mode {
border-radius: 6px;
}
html .app-shell .studio-prompt-card.studio-prompt-card {
border-radius: 8px;
background: var(--sando-prompt);
color: var(--studio-text);
box-shadow: none;
}
@media (max-width: 920px) {
.home-page .hero[data-v-329e3f7c] {
grid-template-rows: minmax(560px, 72svh) auto;
padding-inline: 32px;
}
.home-page .hero-title[data-v-329e3f7c] {
font-size: 3.7rem;
}
}
@media (max-width: 720px) {
.home-page.home-page[data-v-329e3f7c]::before {
height: 620px;
background-image: var(--sando-photo-overlay), url("/sando-build/21ac4e2a59fda76f/assets/sando-workbench.png");
background-position: center, 60% center;
}
.home-page .content-layer[data-v-329e3f7c] {
padding-top: 66px;
}
.home-page .home-corner-chrome[data-v-329e3f7c]::before {
height: 62px;
}
.home-page .top-brand[data-v-329e3f7c] {
top: 12px;
left: 14px;
gap: 8px;
max-width: 63vw;
}
.home-page .brand-logo[data-v-329e3f7c] {
width: 36px;
height: 36px;
}
.home-page .brand-name[data-v-329e3f7c] {
font-size: 13px;
}
.home-page .top-start-btn[data-v-329e3f7c] {
top: 13px;
right: 14px;
min-height: 34px;
padding: 0 10px;
font-size: 12px;
}
.home-page .hero[data-v-329e3f7c] {
width: 100%;
grid-template-rows: minmax(510px, 72svh) auto;
padding: 0 22px 28px;
gap: 0;
}
.home-page .hero-copy[data-v-329e3f7c] {
gap: 12px;
padding: 20px 0;
}
.home-page .hero-title[data-v-329e3f7c] {
font-size: 2.8rem;
line-height: 1.13;
}
.home-page .hero-creative-title[data-v-329e3f7c] {
margin-top: 10px;
font-size: 1.65rem;
}
.home-page .hero-creative-sub[data-v-329e3f7c],
.home-page .hero-creative-sub-secondary[data-v-329e3f7c] {
font-size: .91rem;
line-height: 1.65;
}
.home-page .hero-actions[data-v-329e3f7c] {
width: 100%;
grid-template-columns: repeat(2, minmax(0, 1fr));
justify-content: stretch;
margin-top: 20px;
}
.home-page .btn-primary[data-v-329e3f7c],
.home-page .btn-secondary[data-v-329e3f7c] {
min-width: 0;
padding-inline: 8px;
font-size: 14px;
}
.home-page .value-strip[data-v-329e3f7c] {
grid-template-columns: 1fr;
}
.home-page .value-card[data-v-329e3f7c],
.home-page .value-card[data-v-329e3f7c] + .value-card[data-v-329e3f7c] {
min-height: 0;
padding: 23px 0;
border-left: 0;
border-bottom: 1px solid var(--sando-border);
}
}
/* ===== 导航行尺寸微调（2026-09-29 二次调整）=====
文字比原始版本略大以便阅读，但图标底座收窄、按钮高度克制，
避免整体变胖占地方；高度、间距、圆角按同一比例协调。 */
html .app-shell .studio-rail.studio-rail {
height: 92px !important;
min-height: 92px !important;
padding: 10px 20px !important;
gap: 6px !important;
}
html .app-shell .studio-rail.studio-rail::before {
width: 218px !important;
height: 50px !important;
flex: 0 0 218px !important;
padding: 0 10px 0 53px !important;
font-size: 17px !important;
line-height: 50px !important;
background: transparent url("/api/media/sando-logo.png") 9px center / 38px 38px no-repeat !important;
}
html .app-shell .studio-brand.studio-brand {
min-width: 218px !important;
height: 50px !important;
gap: 10px !important;
}
html .app-shell .studio-brand.studio-brand::before { font-size: 17px !important; }
html .app-shell .studio-brand.studio-brand img {
width: 42px !important;
height: 42px !important;
flex: 0 0 42px !important;
}
/* 按钮：文字 15px，图标底座 32px，高度 56px —— 底座只比文字略大，不再臃肿 */
html .app-shell .studio-rail-btn.studio-rail-btn {
min-width: 68px !important;
min-height: 56px !important;
height: 56px !important;
grid-template-columns: 27px auto !important;
gap: 6px !important;
padding: 0 7px !important;
border-radius: 12px !important;
font-size: 15px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn b[data-v-f522b144] { font-size: 15px !important; }
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 27px !important;
height: 27px !important;
border-radius: 8px !important;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
width: 17px !important;
height: 17px !important;
-webkit-mask-size: 17px 17px !important;
mask-size: 17px 17px !important;
}
html .app-shell .studio-rail-bottom.studio-rail-bottom { gap: 6px !important; }
html .app-shell .studio-main.studio-main { height: calc(100vh - 92px) !important; }
html .app-shell .studio-topbar.studio-topbar {
height: 92px !important;
min-height: 92px !important;
padding: 11px 20px !important;
}
html .app-shell .studio-announcement,
html .app-shell .studio-support-fab,
html .app-shell .studio-topbar-promo { font-size: 15px !important; }
html .app-shell .studio-support-fab { min-height: 46px !important; padding-inline: 14px !important; }
html .app-shell .studio-announcement { height: 44px !important; width: 264px !important; flex-basis: 264px !important; }
html .app-shell .studio-theme-toggle.studio-theme-toggle {
width: 44px !important;
height: 44px !important;
flex: 0 0 44px !important;
}
html .app-shell .studio-announcement-label { min-height: 21px !important; line-height: 21px !important; font-size: 15px !important; }
/* 公告条内部文字（AIGC工作态 / 创作更丝滑）跟随导航字号，避免大小不一 */
html .app-shell .studio-announcement-title,
html .app-shell .studio-announcement-body,
html .app-shell .studio-announcement-viewport,
html .app-shell .studio-announcement em,
html .app-shell .studio-topbar-promo,
html .app-shell .studio-topbar-promo * { font-size: 15px !important; }
/* ===== 导航行紧凑化（2026-09-29 三次调整，参考 Windows 任务栏比例）=====
思路：文字保持可读（14px），但把图标底座、LOGO、切换按钮、两个胶囊框
整体收小，减少水平占位，让导航行更接近任务栏那种紧凑感。 */
html .app-shell .studio-rail.studio-rail {
height: 76px !important;
min-height: 76px !important;
padding: 8px 16px !important;
gap: 5px !important;
}
html .app-shell .studio-rail.studio-rail::before {
width: 186px !important;
height: 44px !important;
flex: 0 0 186px !important;
padding: 0 8px 0 44px !important;
font-size: 15px !important;
line-height: 44px !important;
background: transparent url("/api/media/sando-logo.png") 8px center / 32px 32px no-repeat !important;
}
html .app-shell .studio-brand.studio-brand { min-width: 186px !important; height: 44px !important; gap: 8px !important; }
html .app-shell .studio-brand.studio-brand::before { font-size: 15px !important; }
html .app-shell .studio-brand.studio-brand img { width: 34px !important; height: 34px !important; flex: 0 0 34px !important; }
/* 底座 23px：只比 15px 文字大一档，接近任务栏图标与文字的比例 */
html .app-shell .studio-rail-btn.studio-rail-btn {
min-width: 58px !important;
min-height: 46px !important;
height: 46px !important;
grid-template-columns: 23px auto !important;
gap: 5px !important;
padding: 0 6px !important;
border-radius: 10px !important;
font-size: 14px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn b[data-v-f522b144] { font-size: 14px !important; }
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 23px !important;
height: 23px !important;
border-radius: 7px !important;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
width: 15px !important;
height: 15px !important;
-webkit-mask-size: 15px 15px !important;
mask-size: 15px 15px !important;
}
html .app-shell .studio-rail-bottom.studio-rail-bottom { gap: 5px !important; }
html .app-shell .studio-main.studio-main { height: calc(100vh - 76px) !important; }
html .app-shell .studio-topbar.studio-topbar {
height: 76px !important;
min-height: 76px !important;
padding: 8px 16px !important;
}
html .app-shell .studio-theme-toggle.studio-theme-toggle {
width: 36px !important;
height: 36px !important;
flex: 0 0 36px !important;
}
html .app-shell .studio-announcement { height: 36px !important; width: 216px !important; flex-basis: 216px !important; }
html .app-shell .studio-support-fab { min-height: 38px !important; padding-inline: 12px !important; }
html .app-shell .studio-announcement,
html .app-shell .studio-support-fab,
html .app-shell .studio-topbar-promo,
html .app-shell .studio-announcement-title,
html .app-shell .studio-announcement-body,
html .app-shell .studio-announcement-viewport,
html .app-shell .studio-announcement em,
html .app-shell .studio-topbar-promo * { font-size: 14px !important; }
html .app-shell .studio-announcement-label { min-height: 20px !important; line-height: 20px !important; font-size: 13px !important; padding: 0 6px !important; }
/* ===== 底座极限收窄（2026-09-29 四次调整）=====
用户要求底座接近 Windows 任务栏的紧凑度：底座缩到 20px，
图形 14px，按钮左右留白压到 5px，整体占位再降一档。 */
html .app-shell .studio-rail-btn.studio-rail-btn {
min-width: 54px !important;
min-height: 44px !important;
height: 44px !important;
grid-template-columns: 20px auto !important;
gap: 4px !important;
padding: 0 5px !important;
border-radius: 9px !important;
font-size: 14px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 20px !important;
height: 20px !important;
border-radius: 6px !important;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
width: 14px !important;
height: 14px !important;
-webkit-mask-size: 14px 14px !important;
mask-size: 14px 14px !important;
}
html .app-shell .studio-rail-bottom.studio-rail-bottom { gap: 4px !important; }
/* ===== 底座缩小 1/5（2026-09-29 五次调整）=====
用户要求：底座再缩 20%（20px -> 16px），图标 14px 与字体 14px 保持不变。 */
html .app-shell .studio-rail-btn.studio-rail-btn {
grid-template-columns: 16px auto !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 16px !important;
height: 16px !important;
border-radius: 5px !important;
}
/* ===== 修正：图标恢复尺寸，底座保持窄（2026-09-29 六次调整）=====
前面几轮误把图标一起缩小（25->19->17->15->14），这里把图标恢复到 18px，
底座只比图标大 2px（20px），做到“底座窄、图标清晰”，字体维持 14px。 */
html .app-shell .studio-rail-btn.studio-rail-btn {
grid-template-columns: 20px auto !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 20px !important;
height: 20px !important;
border-radius: 6px !important;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
width: 18px !important;
height: 18px !important;
-webkit-mask-size: 18px 18px !important;
mask-size: 18px 18px !important;
}
/* ===== 按 Windows 任务栏比例对齐（2026-09-29 七次调整）=====
实测任务栏：图标方块 36px、其中图形 24px，比例 1.5:1。
这里以 18px 图形为基准，底座取 27px（18 x 1.5），字体 15px 与之协调。 */
html .app-shell .studio-rail-btn.studio-rail-btn {
grid-template-columns: 27px auto !important;
min-width: 62px !important;
min-height: 48px !important;
height: 48px !important;
gap: 6px !important;
padding: 0 7px !important;
font-size: 15px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn b[data-v-f522b144] { font-size: 15px !important; }
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 27px !important;
height: 27px !important;
border-radius: 8px !important;
}
html .app-shell .studio-rail-btn .studio-rail-ico::before {
width: 18px !important;
height: 18px !important;
-webkit-mask-size: 18px 18px !important;
mask-size: 18px 18px !important;
}
/* ===== 底座按 Windows 任务栏真实比例修正（2026-09-29 八次调整）=====
Windows 11 默认任务栏：图标 32px、方块约 40px，比例 1.25:1。
我们图标 18px，对应底座应为 18 x 1.25 = 22.5px，取 23px。
（上一版的 27px 是目测估算，偏宽 20%，这里纠正。） */
html .app-shell .studio-rail-btn.studio-rail-btn {
grid-template-columns: 23px auto !important;
min-width: 60px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
width: 23px !important;
height: 23px !important;
border-radius: 7px !important;
}
/* ===== 导航栏高度压缩到任务栏级别（2026-09-29 九次调整）=====
用户说的“底座”＝整条导航栏的高度。任务栏实测 49px，这里把导航栏
从 76px 压到 56px，只动高度与内边距；图标 18px、字号 15px 保持不变。 */
html .app-shell .studio-rail.studio-rail {
height: 56px !important;
min-height: 56px !important;
padding: 5px 14px !important;
}
html .app-shell .studio-main.studio-main { height: calc(100vh - 56px) !important; }
html .app-shell .studio-topbar.studio-topbar {
height: 56px !important;
min-height: 56px !important;
padding: 5px 14px !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn {
min-height: 42px !important;
height: 42px !important;
}
html .app-shell .studio-brand.studio-brand { height: 42px !important; }
html .app-shell .studio-rail.studio-rail::before { height: 42px !important; line-height: 42px !important; }
html .app-shell .studio-theme-toggle.studio-theme-toggle {
width: 32px !important;
height: 32px !important;
flex: 0 0 32px !important;
}
html .app-shell .studio-announcement { height: 32px !important; }
html .app-shell .studio-support-fab { min-height: 34px !important; }
/* ===== 图标去底色 + 悬停反馈（2026-09-29 十次调整）=====
默认：图标裸放，不显示底色方块（贴近 Windows 任务栏观感）；
悬停：出现淡绿底色；选中：保持实心绿底。另外拉开品牌块与首个菜单的距离。 */
html .app-shell .studio-rail-btn.studio-rail-btn span[data-v-f522b144] {
background: transparent !important;
border-color: transparent !important;
box-shadow: none !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn:hover span[data-v-f522b144] {
background: rgba(var(--studio-green-rgb), .18) !important;
border-color: rgba(var(--studio-green-rgb), .38) !important;
transform: none !important;
color: var(--studio-green) !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn.is-active span[data-v-f522b144] {
background: var(--studio-green) !important;
border-color: var(--studio-line-strong) !important;
box-shadow: none !important;
}
html .app-shell .studio-rail-btn.studio-rail-btn.is-active:hover span[data-v-f522b144] {
background: var(--studio-green) !important;
transform: none !important;
}
/* 品牌块与「大模型」之间多留一点间距 */
html .app-shell .studio-rail.studio-rail::before { margin-right: 16px !important; }
/* ===== 工具工作台改造成影视墙（2026-09-29）===== */
html body .tools-grid {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)) !important;
gap: 20px 18px !important;
align-items: stretch !important;
}
html body .tool-card {
display: flex !important;
flex-direction: column !important;
padding: 0 !important;
border: 0 !important;
border-radius: 10px !important;
overflow: hidden !important;
background: #fff !important;
box-shadow: 0 4px 14px rgba(10, 44, 25, .10) !important;
transition: transform .22s cubic-bezier(.2,.8,.3,1), box-shadow .22s ease !important;
text-align: left !important;
}
html body .tool-card:hover {
transform: translateY(-4px) !important;
box-shadow: 0 12px 26px rgba(10, 44, 25, .18) !important;
}
/* 封面：竖版 3:4，整块渐变 + 大字工具名 */
html body .tool-card .tool-cover {
position: relative !important;
width: 100% !important;
aspect-ratio: 3 / 4 !important;
display: flex !important;
flex-direction: column !important;
justify-content: flex-end !important;
padding: 12px 12px 14px !important;
box-sizing: border-box !important;
color: #fff !important;
overflow: hidden !important;
}
html body .tool-card .tool-cover .cover-glyph {
position: absolute !important;
top: 10px !important;
right: 12px !important;
font-size: 30px !important;
font-weight: 900 !important;
opacity: .34 !important;
line-height: 1 !important;
}
html body .tool-card .tool-cover .cover-idx {
position: absolute !important;
top: 10px !important;
left: 12px !important;
font-size: 12px !important;
font-weight: 800 !important;
letter-spacing: .08em !important;
opacity: .7 !important;
}
html body .tool-card .tool-cover .cover-name {
position: relative !important;
font-size: 17px !important;
font-weight: 900 !important;
line-height: 1.3 !important;
text-shadow: 0 2px 8px rgba(0, 0, 0, .28) !important;
}
html body .tool-card .tool-cover .cover-cat {
position: relative !important;
margin-top: 6px !important;
font-size: 11px !important;
font-weight: 700 !important;
opacity: .9 !important;
}
html body .tool-card .tool-cover .cover-strip {
position: absolute !important;
left: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 46% !important;
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.42) 100%) !important;
pointer-events: none !important;
}
/* 卡片正文：只留标题与价格，隐藏长描述与标签，贴近影视墙的简洁 */
html body .tool-card .card-body,
html body .tool-card .card-footer { padding: 10px 12px !important; }
html body .tool-card .card-desc,
html body .tool-card .card-summary,
html body .tool-card .tool-tags,
html body .tool-card .card-tags { display: none !important; }
/* 左侧分类：改成影视网站的竖排目录样式 */
html body .toolbox-layout > section:first-child,
html body .toolbox-layout > aside {
background: #fff !important;
border: 1px solid rgba(42, 96, 55, .14) !important;
border-radius: 10px !important;
box-shadow: 0 4px 14px rgba(10, 44, 25, .08) !important;
}
/* ★ 2026-10-09 修夜间模式「工具筛选」栏发灰 + 闪动：
上面那条白底带了 !important，夜间也会生效 —— 而里面的 .sidebar-panel 是
「72% 深色 + backdrop-filter: blur(14px)」的玻璃面板，深色压在纯白上合成出来就是灰色；
blur 每帧重采样那块白底，滚动/重渲染时就会发闪。
修法：夜间把父层白底去掉、面板改成接近不透明并去掉 backdrop-filter。
（浅色模式不受影响：那边本来就有 html.light .sidebar-panel 的白色覆盖。） */
html.dark body .toolbox-layout > section:first-child,
html.dark body .toolbox-layout > aside {
background: transparent !important;
border-color: rgba(120, 220, 160, .14) !important;
box-shadow: none !important;
}
html.dark .sidebar-panel,
html.dark .workbench-panel {
background: rgba(10, 16, 15, .95) !important;
-webkit-backdrop-filter: none !important;
backdrop-filter: none !important;
}
/* ===== 工具墙最终版：只留封面与名称（2026-09-30）=====
参考影视网站的海报墙：竖版封面 2:3 + 封面下方只有一行工具名，
隐藏分类、副标题、描述、标签、状态、价格等所有文字说明。 */
html body .tools-grid {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
gap: 22px 16px !important;
align-items: start !important;
}
html body .tool-card {
display: flex !important;
flex-direction: column !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
text-align: center !important;
overflow: visible !important;
}
html body .tool-card:hover { transform: none !important; box-shadow: none !important; }
/* 封面：纯图，不留任何文字 */
html body .tool-card .tool-cover {
position: relative !important;
width: 100% !important;
aspect-ratio: 2 / 3 !important;
padding: 0 !important;
border-radius: 8px !important;
overflow: hidden !important;
box-shadow: 0 4px 12px rgba(10, 44, 25, .16) !important;
transition: transform .24s cubic-bezier(.2,.8,.3,1), box-shadow .24s ease !important;
}
html body .tool-card:hover .tool-cover {
transform: translateY(-3px) !important;
box-shadow: 0 10px 22px rgba(10, 44, 25, .26) !important;
}
html body .tool-card .tool-cover .cover-name,
html body .tool-card .tool-cover .cover-cat,
html body .tool-card .tool-cover .cover-idx,
html body .tool-card .tool-cover .cover-glyph,
html body .tool-card .tool-cover .cover-strip { display: none !important; }
/* 卡片里除工具名以外的全部内容隐藏 */
html body .tool-card .tool-card-top,
html body .tool-card .card-footer { display: none !important; }
html body .tool-card .tool-card-body > div > *:not(h3) { display: none !important; }
html body .tool-card .tool-card-body { padding: 9px 2px 0 !important; }
html body .tool-card .tool-card-body h3,
html body .tool-card .tool-card-body h3 * {
margin: 0 !important;
padding: 0 !important;
font-size: 13px !important;
font-weight: 600 !important;
line-height: 1.45 !important;
color: #1d3f2a !important;
text-align: center !important;
display: -webkit-box !important;
-webkit-line-clamp: 2 !important;
-webkit-box-orient: vertical !important;
overflow: hidden !important;
text-shadow: none !important;
}
html.light body .tool-card .tool-card-body h3 { color: #1d3f2a !important; }
html.dark body .tool-card .tool-card-body h3 { color: #dcecd6 !important; }
/* 左侧分类：改成影视网站那种朴素的目录行，右侧对齐数量 */
html body .toolbox-sidebar .category-pill {
width: 100% !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 9px 12px !important;
margin: 0 0 2px !important;
border: 0 !important;
border-radius: 8px !important;
background: transparent !important;
color: #47694f !important;
font-size: 13px !important;
font-weight: 500 !important;
box-shadow: none !important;
}
html body .toolbox-sidebar .category-pill:hover { background: rgba(46, 112, 67, .09) !important; }
html body .toolbox-sidebar .category-pill.active {
background: rgba(46, 112, 67, .15) !important;
color: #175c33 !important;
font-weight: 700 !important;
}
html.dark body .toolbox-sidebar .category-pill { color: #b6cfb6 !important; }
html.dark body .toolbox-sidebar .category-pill.active { color: #cfe8a8 !important; }
/* 补齐：卡片内所有文字元素的隐藏清单（按实际层级逐个指定，避免漏项） */
html body .tool-card .tool-category,
html body .tool-card .tool-subtitle,
html body .tool-card .tool-description,
html body .tool-card .tag-row,
html body .tool-card .tag-chip,
html body .tool-card .tool-chip-cluster,
html body .tool-card .scene-chip,
html body .tool-card .status-chip,
html body .tool-card .tool-icon,
html body .tool-card .tool-card-top,
html body .tool-card .card-footer,
html body .tool-card .footer-meta,
html body .tool-card .tool-metrics,
html body .tool-card .tool-price { display: none !important; }
/* 占位封面上的首字标记（有真实图片时自动隐藏） */
html body .tool-card .tool-cover .cover-glyph {
display: block !important;
position: absolute !important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
font-size: 56px !important;
font-weight: 900 !important;
line-height: 1 !important;
color: rgba(255, 255, 255, .30) !important;
text-shadow: 0 2px 10px rgba(0, 0, 0, .18) !important;
pointer-events: none !important;
}
/* ===== 工具墙按分类分组（2026-09-30）=====
每组一个组名（模仿影视网站的"纪录片 ›"），组内是该分类的工具。
用 grid-column 跨列 + order 排序实现，不改变组件原有的 DOM 结构。 */
html body .tools-grid {
grid-auto-flow: row !important;
}
html body .tool-group-head {
grid-column: 1 / -1 !important;
display: flex !important;
align-items: center !important;
gap: 6px !important;
margin: 8px 0 2px !important;
padding: 0 !important;
color: #1d3f2a !important;
font-size: 17px !important;
font-weight: 800 !important;
letter-spacing: .01em !important;
}
html body .tool-group-head .group-arrow {
font-size: 15px !important;
font-weight: 700 !important;
opacity: .55 !important;
}
html body .tool-group-head .group-count {
font-size: 12px !important;
font-weight: 600 !important;
opacity: .5 !important;
margin-left: 2px !important;
}
html.dark body .tool-group-head { color: #dcecd6 !important; }
/* ===== 一键成片工坊：补充的视频参数字段（分辨率 / 生成音频）=====
原版把这两个参数写死在代码里，界面只能改比例；这里补上选择器，
样式跟随左侧「项目设定」面板里原有的下选框。 */
.sando-video-params { display: grid; gap: 10px; }
.sando-video-params select {
width: 100%;
margin-top: 6px;
padding: 9px 12px;
border-radius: 10px;
border: 1px solid rgba(255, 255, 255, .14);
background: #1b1b1b;
color: #f3f8f3;
font: inherit;
font-size: 13px;
cursor: pointer;
}
.sando-video-params select:focus {
outline: none;
border-color: #8ff6ba;
}
/* ===== 工具墙封面（2026-09-30）=====
用卡片自身的伪元素画一张竖版 2:3 海报，避免往 Vue 管理的 DOM 里插节点。
- 有真实图片：把图片放进 assets/tool-covers/ 并在 manifest.json 登记，
页面脚本会把 --cover-image 设成 url(...)，同时清空首字标记。
- 没有图片：--cover-image 是分类渐变色，中间显示工具名首字。 */
html body .tool-card {
position: relative !important;
overflow: visible !important;
}
html body .tool-card::before {
content: attr(data-cover-glyph) !important;
position: static !important;
inset: auto !important;
order: -1 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: auto !important;
aspect-ratio: 2 / 3 !important;
border-radius: 10px !important;
background-image: var(--cover-image, linear-gradient(150deg, #35735a, #10382a)) !important;
background-size: cover !important;
background-position: center !important;
background-repeat: no-repeat !important;
color: rgba(255, 255, 255, .34) !important;
font-size: 46px !important;
font-weight: 900 !important;
line-height: 1 !important;
letter-spacing: .02em !important;
text-shadow: 0 3px 12px rgba(0, 0, 0, .28) !important;
box-shadow: 0 6px 18px rgba(10, 44, 25, .22) !important;
transition: transform .24s cubic-bezier(.2,.8,.3,1), box-shadow .24s ease !important;
pointer-events: none !important;
}
html body .tool-card:hover::before {
transform: translateY(-3px) !important;
box-shadow: 0 12px 26px rgba(10, 44, 25, .3) !important;
}
/* 海报下面只留工具名，不允许正文被 flex 拉高 */
html body .tool-card .tool-card-body {
flex: 0 0 auto !important;
}
html body .tool-card {
min-height: 0 !important;
}
/* 2026-10-14：课程页左侧「课程分类」卡片加高（用户要求至少两倍，底部留白没关系）。
align-content:start 防止 grid 行被拉伸——卡片变高但按钮大小不变，空白留底部。 */
.studio-discovery-sidebar .course-list[data-v-b0d979d5]{min-height:480px;align-content:start}
/* ===== 2026-10-14 进阶会员：购买弹窗（收款码 + 人工确认） ===== */
.adv-modal-mask[data-v-b0d979d5]{position:fixed;inset:0;z-index:200;background:rgba(6,20,13,.6);display:flex;align-items:center;justify-content:center;padding:20px}
.adv-modal[data-v-b0d979d5]{width:min(420px,94vw);max-height:88vh;overflow-y:auto;background:var(--studio-panel);border:1px solid var(--studio-line);border-radius:18px;padding:22px;box-shadow:0 24px 64px rgba(0,0,0,.35)}
.adv-modal-head[data-v-b0d979d5]{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.adv-modal-head strong[data-v-b0d979d5]{font-size:17px;color:var(--studio-text)}
.adv-modal-close[data-v-b0d979d5]{border:0;background:transparent;font-size:22px;line-height:1;color:var(--studio-text-muted);cursor:pointer;padding:2px 8px}
.adv-modal-close[data-v-b0d979d5]:hover{color:var(--studio-text)}
.adv-price[data-v-b0d979d5]{display:flex;align-items:baseline;gap:6px;margin:4px 0 14px}
.adv-price span[data-v-b0d979d5]{font-size:16px;color:var(--studio-text-muted)}
.adv-price strong[data-v-b0d979d5]{font-size:38px;font-weight:800;color:var(--studio-green)}
.adv-qr[data-v-b0d979d5]{display:block;width:200px;height:200px;object-fit:contain;margin:0 auto 14px;border:1px solid var(--studio-line);border-radius:12px;background:#fff}
.adv-steps[data-v-b0d979d5]{background:var(--studio-soft);border-radius:12px;padding:12px 14px;margin-bottom:16px}
.adv-steps p[data-v-b0d979d5]{margin:4px 0;font-size:13px;color:var(--studio-text-muted)}
.adv-cta[data-v-b0d979d5]{width:100%;border:0;border-radius:10px;padding:12px;font:inherit;font-size:15px;font-weight:700;background:var(--studio-green);color:#fff;cursor:pointer}
.adv-cta[data-v-b0d979d5]:hover:not(:disabled){filter:brightness(1.08)}
.adv-cta[data-v-b0d979d5]:disabled{opacity:.6;cursor:default}
.adv-submitted[data-v-b0d979d5]{text-align:center;padding:8px 0}
.adv-submitted strong[data-v-b0d979d5]{display:block;font-size:16px;color:var(--studio-green);margin-bottom:8px}
.adv-submitted p[data-v-b0d979d5]{margin:6px 0 12px;font-size:13px;color:var(--studio-text-muted)}
/* ===== 2026-10-14 进阶会员专区（解锁后的占位视频，后台替换） ===== */
.adv-zone[data-v-b0d979d5]{margin-bottom:14px;border:1px solid var(--studio-line);border-radius:16px;overflow:hidden;background:var(--studio-panel)}
.adv-zone-video[data-v-b0d979d5]{display:block;width:100%;aspect-ratio:16/9;background:#000}
.adv-zone-copy[data-v-b0d979d5]{display:flex;flex-direction:column;gap:2px;padding:12px 14px}
.adv-zone-copy strong[data-v-b0d979d5]{font-size:15px;color:var(--studio-text)}
.adv-zone-copy span[data-v-b0d979d5]{font-size:12px;color:var(--studio-text-muted)}
/* ===== 2026-10-15 Codex 编程入门基础：14 节课站内接入（统一影视网格卡 → 14 章 → 正文） ===== */
.md-course-zone[data-v-b0d979d5]{min-width:0}
/* 章节列表 / 正文 共用头部 */
.md-view-head[data-v-b0d979d5]{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:12px 14px;border:1px solid var(--studio-line);border-radius:14px;background:var(--studio-panel)}
.md-view-title[data-v-b0d979d5]{font-size:15px;font-weight:700;color:var(--studio-text)}
.md-view-count[data-v-b0d979d5]{margin-left:auto;font-size:12px;color:var(--studio-text-muted)}
.md-back-btn[data-v-b0d979d5]{border:1px solid var(--studio-line);background:var(--studio-soft);color:var(--studio-text);border-radius:8px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer}
.md-back-btn[data-v-b0d979d5]:hover{border-color:var(--studio-line-strong)}
/* 章节列表 */
.md-chapter-list[data-v-b0d979d5]{display:flex;flex-direction:column;gap:8px}
.md-chapter-item[data-v-b0d979d5]{display:flex;align-items:flex-start;gap:12px;width:100%;text-align:left;border:1px solid var(--studio-line);border-radius:12px;background:var(--studio-panel);padding:12px 14px;font:inherit;cursor:pointer;transition:border-color .15s ease}
.md-chapter-item[data-v-b0d979d5]:hover{border-color:var(--studio-green)}
.md-chapter-no[data-v-b0d979d5]{flex:none;min-width:26px;font-size:13px;font-weight:800;color:var(--studio-green)}
.md-chapter-body[data-v-b0d979d5]{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.md-chapter-body strong[data-v-b0d979d5]{font-size:14px;font-weight:700;line-height:1.5;color:var(--studio-text)}
.md-chapter-body small[data-v-b0d979d5]{font-size:12px;line-height:1.6;color:var(--studio-text-muted)}
.md-chapter-go[data-v-b0d979d5]{flex:none;align-self:center;font-size:12px;color:var(--studio-green)}
/* 正文（marked 渲染，v-html 注入：后代选择器不带 scoped 属性才能命中注入节点） */
.md-lesson-loading[data-v-b0d979d5]{padding:28px;text-align:center;font-size:13px;color:var(--studio-text-muted)}
.md-lesson-body[data-v-b0d979d5]{border:1px solid var(--studio-line);border-radius:14px;background:var(--studio-panel);padding:20px 24px;font-size:14px;line-height:1.85;color:var(--studio-text);overflow-wrap:break-word;min-width:0}
.md-lesson-body[data-v-b0d979d5] h1{font-size:22px;margin:0 0 14px;line-height:1.4}
.md-lesson-body[data-v-b0d979d5] h2{font-size:18px;margin:28px 0 10px;padding-left:10px;border-left:3px solid var(--studio-green);line-height:1.5}
.md-lesson-body[data-v-b0d979d5] h3{font-size:16px;margin:22px 0 8px}
.md-lesson-body[data-v-b0d979d5] h4{font-size:14px;margin:18px 0 6px}
.md-lesson-body[data-v-b0d979d5] p{margin:8px 0}
.md-lesson-body[data-v-b0d979d5] ul,.md-lesson-body[data-v-b0d979d5] ol{margin:8px 0;padding-left:24px}
.md-lesson-body[data-v-b0d979d5] li{margin:4px 0}
.md-lesson-body[data-v-b0d979d5] blockquote{margin:12px 0;padding:8px 14px;border-left:3px solid var(--studio-line-strong);background:var(--studio-soft);color:var(--studio-text-muted);border-radius:0 8px 8px 0}
.md-lesson-body[data-v-b0d979d5] pre{margin:12px 0;padding:14px;background:var(--studio-rail);border:1px solid var(--studio-line);border-radius:10px;overflow-x:auto}
.md-lesson-body[data-v-b0d979d5] pre code{background:transparent;border:0;padding:0;font-size:12.5px;line-height:1.7}
.md-lesson-body[data-v-b0d979d5] code{font-family:ui-monospace,SFMono-Regular,Consolas,"Courier New",monospace}
.md-lesson-body[data-v-b0d979d5] :not(pre)>code{background:var(--studio-soft);border:1px solid var(--studio-line);border-radius:5px;padding:1px 5px;font-size:12.5px;color:var(--studio-green)}
.md-lesson-body[data-v-b0d979d5] table{width:100%;border-collapse:collapse;margin:12px 0;font-size:13px}
.md-lesson-body[data-v-b0d979d5] th,.md-lesson-body[data-v-b0d979d5] td{border:1px solid var(--studio-line);padding:6px 10px;text-align:left}
.md-lesson-body[data-v-b0d979d5] th{background:var(--studio-soft)}
.md-lesson-body[data-v-b0d979d5] hr{border:0;border-top:1px solid var(--studio-line);margin:20px 0}
.md-lesson-body[data-v-b0d979d5] a{color:var(--studio-green)}
.md-lesson-body[data-v-b0d979d5] img{max-width:100%;border-radius:8px}
/* 2026-10-15 用户要求：课程卡片区往上方、右方微移，页面更协调 */
.md-course-zone .studio-course-search[data-v-b0d979d5]{margin-bottom:6px}
.md-course-zone .studio-card-grid[data-v-b0d979d5]{margin-top:10px;padding-left:30px;padding-right:8px}
.md-course-zone .studio-course-card-meta[data-v-b0d979d5]{margin-left:30px;margin-right:8px}
@media(max-width:960px){.md-course-zone .studio-card-grid[data-v-b0d979d5],.md-course-zone .studio-course-card-meta[data-v-b0d979d5]{padding-left:0;margin-left:0}}
/* 2026-10-15 用户要求：卡片统一"缩略图+链接+摘要"，标题一行、摘要另起一行、全部左对齐 */
.studio-course-catalog-shell{display:block;width:100%;min-width:0;text-align:left}
.studio-course-catalog-shell .studio-course-card-meta{display:flex;justify-content:space-between;align-items:center;margin:0 2px 8px;text-align:left}
.studio-course-catalog-shell .studio-course-card-meta span,.studio-course-catalog-shell .studio-course-card-meta strong{text-align:left}
.studio-course-catalog-shell .studio-catalog-card{text-align:left}
.studio-course-catalog-shell .studio-catalog-copy{display:grid;gap:6px;text-align:left}
.studio-course-catalog-shell .studio-catalog-copy strong{display:block;min-height:0;font-size:16px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;-webkit-line-clamp:unset}
.studio-course-catalog-shell .studio-catalog-copy small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:0;margin-top:0;text-align:left;font-size:12px;line-height:1.55}
/* 章节预览：缩略图+链接+摘要 */
.md-chapter-item[data-v-b0d979d5]{align-items:center}
.md-chapter-thumb{flex:none;width:132px;aspect-ratio:16/9;object-fit:cover;border-radius:10px;display:block}
.md-chapter-body{flex:1;min-width:0;display:grid;gap:4px;text-align:left}
.md-chapter-body strong{display:block;font-size:14px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left}
.md-chapter-body small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;text-align:left;line-height:1.5}
.md-chapter-go{flex:none}
/* 进阶课程视频播放区 */
.adv-zone{display:grid;gap:12px;width:100%;padding:14px;border:1px solid var(--studio-line);border-radius:16px;background:var(--studio-panel)}
.adv-zone-video{width:100%;max-height:480px;border-radius:12px;background:#000;display:block}
.adv-zone-copy{display:grid;gap:4px;text-align:left}
.adv-zone-copy strong{color:var(--studio-text);font-size:15px}
.adv-zone-copy span{color:var(--studio-text-muted);font-size:12px}
/* ===== 2026-10-15 course-fix：导航栏加高+图标装饰（SandoNavigation scope f522b144） ===== */
.app-shell .studio-rail.studio-rail{min-height:64px!important}
.app-shell .studio-rail .studio-rail-btn.studio-rail-btn{gap:10px!important;padding:11px 16px!important;min-height:46px;align-items:center}
.app-shell .studio-rail .studio-rail-btn span{display:inline-flex;align-items:center;gap:2px}
.studio-rail-ico{width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;margin-right:9px;flex:none;opacity:.95;filter:saturate(1.15)}
.studio-rail-ico svg{width:100%;height:100%;display:block}
.app-shell .studio-rail .studio-rail-btn:hover .studio-rail-ico{transform:scale(1.12)}
.app-shell .studio-rail .studio-rail-btn .studio-rail-ico{transition:transform .18s ease}
.app-shell .studio-rail .studio-rail-btn[class*="is-active"] .studio-rail-ico,
.app-shell .studio-rail .studio-rail-btn.is-active .studio-rail-ico{filter:drop-shadow(0 0 6px #58d46a88) saturate(1.3)}
/* ===== 卡片区上移（搜索框已移除） ===== */
.md-course-zone[data-v-b0d979d5]{padding-top:4px}
.studio-card-grid.studio-course-card-grid{margin-top:14px!important}
/* ===== 2026-10-15 照搬"课程中心"静态版式：单元列表改为卡片墙 ===== */
.md-chapter-list[data-v-b0d979d5]{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;max-width:1180px;margin:24px auto 60px;padding:0 20px}
.md-chapter-item[data-v-b0d979d5]{display:flex;flex-direction:column;align-items:stretch;gap:0;width:auto;text-align:left;border:1px solid var(--studio-line);border-radius:16px;background:var(--studio-panel);padding:0;overflow:hidden;cursor:pointer;font:inherit;transition:transform .2s,border-color .2s,box-shadow .2s;box-shadow:0 6px 22px rgba(0,0,0,.18)}
.md-chapter-item[data-v-b0d979d5]:hover{transform:translateY(-4px);border-color:var(--studio-green);box-shadow:0 12px 30px rgba(82,111,31,.22)}
.md-chapter-thumb,.md-chapter-thumb[data-v-b0d979d5]{flex:none;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0;display:block}
.md-chapter-body[data-v-b0d979d5]{display:block;flex:1;min-width:0;gap:0;padding:16px 18px 20px;text-align:left}
.md-chapter-kicker[data-v-b0d979d5]{display:block;font-size:12px;letter-spacing:2px;font-weight:700;color:var(--studio-green);margin:0 0 6px}
.md-chapter-body strong,.md-chapter-body strong[data-v-b0d979d5]{display:block;white-space:normal;overflow:visible;text-overflow:clip;font-size:18px;font-weight:700;line-height:1.35;margin:0 0 8px;color:var(--studio-text);text-align:left}
.md-chapter-body small,.md-chapter-body small[data-v-b0d979d5]{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:13.5px;line-height:1.6;margin:0 0 14px;color:var(--studio-text-muted);text-align:left}
.md-chapter-go,.md-chapter-go[data-v-b0d979d5]{flex:none;align-self:flex-start;font-size:13px;font-weight:600;color:var(--studio-green)}
/* ===== 照搬 chapter.html：正文阅读卡片排版 ===== */
.md-lesson-body[data-v-b0d979d5]{max-width:860px;margin:0 auto;background:var(--studio-panel);border:1px solid var(--studio-line);border-radius:14px;padding:30px 34px;line-height:1.75;color:var(--studio-text)}
.md-lesson-body h1{font-size:26px;margin:.2em 0 .6em;line-height:1.35;color:var(--studio-text)}
.md-lesson-body h2{font-size:21px;margin:1.6em 0 .6em;padding-bottom:.3em;border-bottom:1px solid var(--studio-line);color:var(--studio-text)}
.md-lesson-body h3{font-size:17px;margin:1.3em 0 .5em;color:var(--studio-text-muted)}
.md-lesson-body p{margin:.7em 0;color:var(--studio-text)}
.md-lesson-body ul,.md-lesson-body ol{padding-left:1.4em;margin:.6em 0}
.md-lesson-body li{margin:.3em 0}
.md-lesson-body a{color:var(--studio-green)}
.md-lesson-body blockquote{margin:.8em 0;padding:.6em 1em;border-left:3px solid var(--studio-green);background:rgba(122,180,120,.08);color:var(--studio-text-muted);border-radius:0 8px 8px 0}
.md-lesson-body code{background:rgba(0,0,0,.35);padding:.15em .4em;border-radius:5px;font-size:.9em;color:var(--studio-green);font-family:"SFMono-Regular",Consolas,monospace}
.md-lesson-body pre{background:rgba(0,0,0,.35);border:1px solid var(--studio-line);border-radius:10px;padding:16px 18px;overflow:auto}
.md-lesson-body pre code{background:none;padding:0;color:var(--studio-text)}
.md-lesson-body table{border-collapse:collapse;width:100%;margin:1em 0;font-size:14px}
.md-lesson-body th,.md-lesson-body td{border:1px solid var(--studio-line);padding:8px 12px;text-align:left}
.md-lesson-body th{background:rgba(122,180,120,.1);color:var(--studio-text-muted)}
.md-lesson-body img{max-width:100%}
/* ===== 上一课 / 下一课 导航 ===== */
.md-lesson-nav[data-v-b0d979d5]{display:flex;justify-content:space-between;gap:12px;max-width:860px;margin:18px auto 60px;padding:0 20px}
.md-nav-btn{flex:1;min-width:0;text-align:center;background:var(--studio-panel);border:1px solid var(--studio-line);border-radius:10px;padding:12px;color:var(--studio-green);font-size:13px;font-family:inherit;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transition:border-color .2s}
.md-nav-btn:hover{border-color:var(--studio-green)}
.md-nav-btn.is-disabled{opacity:.35;pointer-events:none}
/* ===== 2026-10-15b 组件 CSS（D5Yvn-qL.css）动态加载在 course-fix.css 之后，
同优先级会压掉上面的卡片墙规则 —— 这里用双类名提高优先级，确保必胜 ===== */
.md-chapter-list.md-chapter-list[data-v-b0d979d5]{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;max-width:1180px;margin:24px auto 60px;padding:0 20px}
.md-chapter-item.md-chapter-item[data-v-b0d979d5]{display:flex;flex-direction:column;align-items:stretch;gap:0;width:auto;text-align:left;border:1px solid var(--studio-line);border-radius:16px;background:var(--studio-panel);padding:0;overflow:hidden;cursor:pointer;font:inherit;transition:transform .2s,border-color .2s,box-shadow .2s;box-shadow:0 6px 22px rgba(0,0,0,.18)}
.md-chapter-item.md-chapter-item[data-v-b0d979d5]:hover{transform:translateY(-4px);border-color:var(--studio-green);box-shadow:0 12px 30px rgba(82,111,31,.22)}
.md-chapter-thumb.md-chapter-thumb,.md-chapter-thumb.md-chapter-thumb[data-v-b0d979d5]{flex:none;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:0;display:block}
.md-chapter-body.md-chapter-body[data-v-b0d979d5]{display:block;flex:1;min-width:0;gap:0;padding:16px 18px 20px;text-align:left}
.md-chapter-kicker.md-chapter-kicker[data-v-b0d979d5]{display:block;font-size:12px;letter-spacing:2px;font-weight:700;color:var(--studio-green);margin:0 0 6px}
.md-chapter-body.md-chapter-body[data-v-b0d979d5] strong{display:block;white-space:normal;overflow:visible;text-overflow:clip;font-size:18px;font-weight:700;line-height:1.35;margin:0 0 8px;color:var(--studio-text);text-align:left}
.md-chapter-body.md-chapter-body[data-v-b0d979d5] small{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:13.5px;line-height:1.6;margin:0 0 14px;color:var(--studio-text-muted);text-align:left}
.md-chapter-go.md-chapter-go[data-v-b0d979d5]{flex:none;align-self:flex-start;font-size:13px;font-weight:600;color:var(--studio-green)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5]{max-width:860px;margin:0 auto;background:var(--studio-panel);border:1px solid var(--studio-line);border-radius:14px;padding:30px 34px;line-height:1.75;color:var(--studio-text);font-size:15px}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] h1{font-size:26px;margin:.2em 0 .6em;line-height:1.35;color:var(--studio-text);border-left:none;padding-left:0}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] h2{font-size:21px;margin:1.6em 0 .6em;padding-left:0;padding-bottom:.3em;border-left:none;border-bottom:1px solid var(--studio-line);color:var(--studio-text)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] h3{font-size:17px;margin:1.3em 0 .5em;color:var(--studio-text-muted)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] p{margin:.7em 0;color:var(--studio-text)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] ul,.md-lesson-body.md-lesson-body[data-v-b0d979d5] ol{padding-left:1.4em;margin:.6em 0}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] li{margin:.3em 0}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] a{color:var(--studio-green)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] blockquote{margin:.8em 0;padding:.6em 1em;border-left:3px solid var(--studio-green);background:rgba(122,180,120,.08);color:var(--studio-text-muted);border-radius:0 8px 8px 0}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] code{background:rgba(0,0,0,.35);padding:.15em .4em;border-radius:5px;font-size:.9em;color:var(--studio-green);font-family:"SFMono-Regular",Consolas,monospace}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] pre{background:rgba(0,0,0,.35);border:1px solid var(--studio-line);border-radius:10px;padding:16px 18px;overflow:auto}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] pre code{background:none;padding:0;color:var(--studio-text)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] table{border-collapse:collapse;width:100%;margin:1em 0;font-size:14px}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] th,.md-lesson-body.md-lesson-body[data-v-b0d979d5] td{border:1px solid var(--studio-line);padding:8px 12px;text-align:left}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] th{background:rgba(122,180,120,.1);color:var(--studio-text-muted)}
.md-lesson-body.md-lesson-body[data-v-b0d979d5] img{max-width:100%}
/* ===== 2026-10-15c "开始学习"移到卡片右下，离边缘留出空隙 ===== */
.md-chapter-go.md-chapter-go[data-v-b0d979d5]{align-self:flex-end;margin:2px 16px 14px 0}
/* ===== 2026-10-15d 章节封面缩小到与课程列表页一致（158px 固定高） ===== */
.md-chapter-thumb.md-chapter-thumb,.md-chapter-thumb.md-chapter-thumb[data-v-b0d979d5]{width:100%;height:158px;aspect-ratio:auto;object-fit:cover}
/* ===== 2026-10-15e 三处细节修正 ===== */
/* 返回按钮：深底绿字，不再刺眼看不清 */
.md-back-btn.md-back-btn[data-v-b0d979d5]{background:var(--studio-panel);color:var(--studio-green);border:1px solid var(--studio-line-strong);font-weight:600}
.md-back-btn.md-back-btn[data-v-b0d979d5]:hover{border-color:var(--studio-green)}
/* 正文页顶栏吸附顶端：标题与返回按钮滚动时保持可见 */
.md-view-head.md-view-head[data-v-b0d979d5]{position:sticky;top:0;z-index:20;background:var(--studio-bg)}
/* ===== 2026-10-15f 课程类型按钮：加顶部菜单同款线性图标 + 字体风格对齐 ===== */
.studio-course-type-tabs button[data-v-b0d979d5]{font-size:14px;font-weight:600;letter-spacing:.3px;gap:8px}
.studio-course-type-tabs button[data-v-b0d979d5]::before{content:"";flex:none;width:15px;height:15px;background-color:currentColor;-webkit-mask:var(--tab-ico) no-repeat center/contain;mask:var(--tab-ico) no-repeat center/contain}
.studio-course-type-tabs button:first-child[data-v-b0d979d5]{--tab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.42 10.922a1 1 0 0 0-.019-1.838L12.83 5.18a2 2 0 0 0-1.66 0L2.6 9.08a1 1 0 0 0 0 1.832l8.57 3.908a2 2 0 0 0 1.66 0z'/%3E%3Cpath d='M22 10v6'/%3E%3Cpath d='M6 12.5V16a6 3 0 0 0 12 0v-3.5'/%3E%3C/svg%3E")}
.studio-course-type-tabs button:last-child[data-v-b0d979d5]{--tab-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z'/%3E%3Cpath d='m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z'/%3E%3Cpath d='M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0'/%3E%3Cpath d='M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5'/%3E%3C/svg%3E")}
/* 进阶视频课：正文视频与目录标题 */
.md-lesson-body video{width:100%;max-width:100%;border-radius:12px;background:#000;margin:4px 0 14px;display:block}
.md-chapter-body strong{display:block;font-size:15px;font-weight:600;color:#1f2937;margin:0 0 3px;line-height:1.4}