.catalog-studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,366px);grid-template-rows:auto minmax(0,1fr) auto;gap:18px 28px;height:100dvh;min-height:560px;margin:0;padding:0 20px 24px;color:var(--text-primary);font-family:var(--font-sans)}.catalog-studio .catalog-layout{display:contents}.catalog-studio .cc-skill-layout-heading{grid-area:1 / 1}.catalog-studio .cc-skill-layout-heading>p{margin-top:10px}.catalog-studio .cc-skill-layout-preview{grid-area:2 / 1;padding:0;overflow:hidden;container-type:size}.catalog-studio .cc-skill-layout-example{width:min(100%,calc((100cqh - 44px) * var(--example-aspect)));max-width:100%}.catalog-studio .cc-skill-layout-example .cc-video-media{max-height:calc(100cqh - 44px);border-radius:16px}.catalog-studio .cc-skill-layout-panel{grid-column:2;grid-row:1 / 4}.ugc-selected-title{margin:0 0 2px;font-size:15px;font-weight:600}.ugc-hint,.ugc-cost,.ugc-error{margin:0;font-size:12px;line-height:1.5}.ugc-hint{color:var(--text-secondary)}.ugc-cost{color:var(--text-tertiary);font-size:11px}.ugc-error{color:var(--danger, #d44141);overflow-wrap:anywhere}.ugc-details{border-top:1px solid var(--divider-strong);padding-top:12px}.ugc-details summary{cursor:pointer;font-size:13px;color:var(--text-secondary)}.ugc-details>div{display:flex;flex-direction:column;gap:14px;margin-top:14px}@media(max-width:900px){.catalog-studio{grid-template-columns:minmax(0,1fr) minmax(270px,320px);gap:16px;padding:0 16px 20px}}@media(max-width:700px){.catalog-studio{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto;height:auto;min-height:100dvh;padding:16px 12px}.catalog-studio .cc-skill-layout-preview{grid-area:2 / 1;container-type:normal}.catalog-studio .cc-skill-layout-example{width:min(100%,calc(45dvh * var(--example-aspect)))}.catalog-studio .cc-skill-layout-example .cc-video-media{max-height:45dvh}.catalog-studio .cc-skill-layout-panel{grid-area:4 / 1}}.catalog-studio .cc-video-frame{background:transparent}.selected-case{font-weight:600;margin:0}.error{color:#b91c1c;font-size:13px}.estimate{font-size:11px;line-height:1.5;opacity:.68;margin-top:8px}.catalog-studio>.cc-skill-style-picker{grid-area:3 / 1}.translation-form .skill-file-grid{grid-template-columns:minmax(0,1fr)}.translation-form .skill-file-add{width:100%}.translation-form .skill-file-add:only-child{grid-column:1 / -1;height:auto;aspect-ratio:16 / 9;gap:8px;font-size:13px;line-height:20px}.translation-form .skill-file-add:only-child svg{width:22px;height:22px}.translation-form .skill-file-name{overflow-wrap:anywhere}@media(min-width:701px){.catalog-studio.translation-form{grid-template-columns:minmax(0,1fr) 380px;column-gap:24px;padding:0 24px 24px}}.translation-form .lang-select{position:relative}.translation-form .lang-trigger{display:flex;width:100%;height:40px;align-items:center;gap:10px;padding:0 12px;border:1px solid var(--divider-strong);border-radius:8px;background:transparent;color:var(--text-primary);font:inherit;font-size:13px;text-align:left;cursor:pointer;transition:border-color .15s}.translation-form .lang-trigger:hover:not(:disabled),.translation-form .lang-select.is-open .lang-trigger{border-color:color-mix(in srgb,var(--text-primary) 30%,transparent)}.translation-form .lang-trigger:focus-visible{outline:2px solid color-mix(in srgb,var(--text-primary) 18%,transparent);outline-offset:1px}.translation-form .lang-trigger:disabled{opacity:.45;cursor:not-allowed}.translation-form .lang-placeholder{color:var(--text-tertiary)}.translation-form .lang-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.translation-form .lang-chevron{width:14px;height:14px;margin-left:auto;flex-shrink:0;fill:none;stroke:var(--text-tertiary);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s cubic-bezier(.2,.8,.2,1)}.translation-form .lang-select.is-open .lang-chevron{transform:rotate(180deg)}.translation-form .lang-flag{position:relative;display:inline-block;width:18px;height:18px;flex-shrink:0;overflow:hidden;border-radius:50%}.translation-form .lang-flag svg{display:block;width:100%;height:100%}.translation-form .lang-flag:after{content:"";position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1px #27251f24}.translation-form .lang-menu{position:fixed;z-index:50;padding:6px;border:1px solid var(--divider);border-radius:12px;background:var(--surface-raised,var(--background));box-shadow:0 18px 40px -14px #27251f38,0 2px 6px #27251f0d;opacity:0;transform:translateY(-6px);clip-path:inset(0 0 92% 0 round 12px);pointer-events:none;transition:clip-path .18s cubic-bezier(.4,0,.6,1),opacity .12s ease .04s,transform .18s ease}.translation-form .lang-select.is-up .lang-menu{transform:translateY(6px);clip-path:inset(92% 0 0 0 round 12px)}.translation-form .lang-select.is-open .lang-menu{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 12px);pointer-events:auto;transition:clip-path .28s cubic-bezier(.2,.8,.2,1),opacity .14s ease,transform .28s cubic-bezier(.2,.8,.2,1)}.translation-form .lang-scroll{overflow-y:auto;overscroll-behavior:contain}.translation-form .lang-group{padding:8px 10px 2px;color:var(--text-tertiary);font-size:11px;line-height:16px}.translation-form .lang-option{display:flex;width:100%;height:36px;align-items:center;gap:10px;padding:0 10px;border:0;border-radius:8px;background:transparent;color:var(--text-primary);font:inherit;font-size:13px;text-align:left;cursor:pointer}.translation-form .lang-option:hover,.translation-form .lang-option:focus-visible{background:var(--surface-tint);outline:none}.translation-form .lang-option[aria-selected=true]{background:var(--surface-hover);font-weight:600}.translation-form .lang-check{width:16px;height:16px;margin-left:auto;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;opacity:0}.translation-form .lang-option[aria-selected=true] .lang-check{opacity:1}html:not(.dark) .translation-form .lang-trigger,html:not(.dark) .translation-form .lang-menu{background:#fff}@media(prefers-reduced-motion:reduce){.translation-form .lang-menu,.translation-form .lang-chevron{transition:none}}
