:root{color:#f5f7fb;background:#07111f;font-family:IBM Plex Sans,Noto Sans SC,PingFang SC,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;background:radial-gradient(circle at top left,rgba(56,189,248,.2),transparent 28rem),radial-gradient(circle at top right,rgba(14,165,233,.14),transparent 30rem),linear-gradient(180deg,#07111f,#0b1627 46%,#0f1d30);color:#f5f7fb}button,input,select,textarea{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}.loadingScreen{min-height:100vh;display:grid;place-items:center;gap:14px;font-weight:700;color:#d9f3ff}.appShell{width:min(1500px,calc(100% - 32px));margin:0 auto;padding:28px 0 40px}.heroBar,.controlPanel,.assetPanel,.workspacePanel,.assetCard,.panelSection,.resultCard,.resultEmpty,.errorNotice{border:1px solid rgba(255,255,255,.1);background:#0c1728b8;box-shadow:0 26px 80px #0000003d;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.heroBar{display:grid;gap:18px;padding:28px;border-radius:24px}.brandLockup{display:flex;align-items:center;gap:18px}.brandMark{display:grid;place-items:center;width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#04111b}.eyebrow{margin:0 0 6px;color:#8bdcff;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.heroBar h1{margin:0;font-size:clamp(30px,4vw,46px);line-height:1.05}.heroCopy{margin:0;max-width:880px;color:#bfd5ec;font-size:16px;line-height:1.75}.workspaceLayout{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(0,1.08fr) minmax(340px,.92fr);gap:18px;margin-top:20px;align-items:start}.controlPanel,.assetPanel,.workspacePanel{border-radius:24px;padding:20px}.controlPanel{display:grid;gap:16px;position:sticky;top:16px}.panelSection{border-radius:18px;padding:16px}.panelTitle,.panelHeading,.editorHeader{display:flex;align-items:center;justify-content:space-between;gap:12px}.panelTitle h2,.panelHeading h2,.editorHeader h3{margin:0;font-size:18px}.panelHeading{margin-bottom:14px}.panelHeading>div h2{margin-top:4px}.categoryPills,.assetTagRow,.tagList{display:flex;flex-wrap:wrap;gap:8px}.categoryPills button,.tagList span,.assetTagRow span{border-radius:999px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#d7e4f4;padding:9px 12px;font-size:13px}.categoryPills button.active{border-color:#38bdf8b8;background:#0ea5e929;color:#f8fdff}.searchField{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;border-radius:14px;padding:12px 14px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a}.searchField input,.filterGroup select,.editorSection textarea{border:0;background:transparent;color:#f5f7fb;outline:none}.searchField input::placeholder,.editorSection textarea::placeholder{color:#89a0ba}.filterStack,.parameterGrid{display:grid;gap:12px}.filterGroup{display:grid;gap:8px}.filterGroup span{color:#bdd0e5;font-size:13px;font-weight:700}.filterGroup select{width:100%;border-radius:14px;padding:12px 14px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;appearance:none}.compactHint{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start}.compactHint p,.assetCardBody p,.mutedText{margin:0;color:#9eb3ca;line-height:1.6}.assetGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;max-height:calc(100vh - 220px);overflow:auto;padding-right:4px}.assetEmptyState{min-height:240px;display:grid;place-items:center;gap:10px;padding:24px;border-radius:18px;border:1px dashed rgba(139,220,255,.26);background:#ffffff08;color:#a8bed4;text-align:center;grid-column:1 / -1}.assetCard{display:grid;gap:12px;padding:12px;border-radius:18px;text-align:left;transition:transform .18s ease,border-color .18s ease,background .18s ease}.assetCard:hover,.assetCard.active{transform:translateY(-2px);border-color:#38bdf8a6;background:#112034eb}.assetCardMedia{position:relative;overflow:hidden;border-radius:14px;aspect-ratio:1 / 1;background:#ffffff0a}.assetCardMedia img{width:100%;height:100%;object-fit:cover}.assetBadge{position:absolute;top:10px;left:10px;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700}.assetBadge.template{background:#3b82f6e6;color:#eff8ff}.assetBadge.case{background:#10b981e6;color:#f0fdf4}.assetCardBody{display:grid;gap:8px}.assetCardCategory{color:#6dd7ff;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.assetCardBody h3{margin:0;font-size:18px;line-height:1.35}.workspacePanel{display:grid;gap:16px}.editorSection{display:grid;gap:12px}.editorSection textarea{min-height:320px;resize:vertical;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:#ffffff0a;padding:16px;line-height:1.7}.ghostButton,.primaryButton{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:14px;padding:0 16px;font-weight:700}.ghostButton{border:1px solid rgba(255,255,255,.12);background:#ffffff0a;color:#f5f7fb}.primaryButton{border:0;background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#03131f}.primaryButton:disabled{cursor:not-allowed;opacity:.68}.parameterGrid{grid-template-columns:repeat(3,minmax(0,1fr))}.actionBar{display:flex;align-items:center;justify-content:space-between;gap:16px}.actionBar .mutedText{max-width:360px}.errorNotice{border-radius:16px;padding:14px 16px;color:#ffd7dd;background:#7f1d1d8c;border-color:#f8717147}.resultSection{display:grid;gap:14px}.resultEmpty,.resultCard{border-radius:18px}.resultEmpty{min-height:240px;display:grid;place-items:center;gap:10px;padding:24px;text-align:center;color:#a8bed4}.resultGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.resultCard{overflow:hidden}.resultCard img{width:100%;aspect-ratio:1 / 1;object-fit:cover}.resultCard figcaption{padding:12px 14px;color:#d3e2f3;font-size:13px}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:1280px){.workspaceLayout{grid-template-columns:1fr}.controlPanel{position:static}.assetGrid{max-height:none}}@media(max-width:900px){.appShell{width:min(100% - 20px,100%);padding-top:18px}.heroBar,.controlPanel,.assetPanel,.workspacePanel{padding:16px;border-radius:20px}.brandLockup{align-items:flex-start}.assetGrid,.resultGrid,.parameterGrid{grid-template-columns:1fr}.actionBar{flex-direction:column;align-items:stretch}.actionBar .mutedText{max-width:none}}
