.banner-templates-page{--template-border:#e2e8f0;--template-muted:#f8fafc;--template-accent:#5145e5;flex-direction:column;gap:16px;display:flex}.banner-template-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));align-items:stretch;gap:16px;display:grid}.banner-template-card{border:1px solid var(--template-border);background:#fff;border-radius:16px;flex-direction:column;min-width:0;display:flex;overflow:hidden}.banner-template-preview{background:var(--template-muted);color:#64748b;place-items:center;width:100%;min-height:140px;display:grid;position:relative;overflow:hidden;container-type:inline-size}.banner-template-background-image{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.banner-template-delete-button{z-index:1;opacity:0;visibility:hidden;transition:opacity .16s,transform .16s,visibility .16s;position:absolute;top:10px;right:10px;transform:translateY(-4px)}.banner-template-card:hover .banner-template-delete-button,.banner-template-card:focus-within .banner-template-delete-button,.banner-template-delete-button.ant-btn-loading{opacity:1;visibility:visible;transform:translateY(0)}.banner-template-object-text{white-space:pre-wrap;align-items:center;line-height:1.1;display:flex;overflow:hidden}.banner-template-preview .banner-template-object-text,.banner-editor-canvas .banner-template-object-text{overflow:visible}.banner-template-object-image{object-fit:contain}.banner-template-details{flex-direction:column;flex:1;align-items:flex-start;gap:4px;padding:12px 14px 14px;display:flex}.banner-template-details>.ant-btn:not(.banner-template-use-button){margin-top:8px}.banner-template-name{overflow-wrap:anywhere;max-width:100%;font-size:15px}.banner-template-category{color:#64748b}.banner-template-use-button{margin-top:auto}.banner-template-use-button.ant-btn-primary{border-color:var(--template-accent);background:var(--template-accent);border-radius:12px;font-weight:600}.banner-template-skeleton{border:1px solid var(--template-border);background:linear-gradient(110deg,#f6f8fb 8%,#fff 18%,#f6f8fb 33%) 0 0/200% 100%;border-radius:16px;min-height:420px;animation:1.4s infinite banner-template-loading}.banner-editor-page-header{justify-content:space-between;width:100%;margin-bottom:16px}.banner-editor-layout{grid-template-columns:minmax(0,1fr) 240px;align-items:start;gap:20px;display:grid}.banner-editor-workspace{min-width:0}.banner-editor-toolbar{margin-bottom:16px}.banner-editor-canvas-wrap{background-color:#f2f4f6;background-image:linear-gradient(45deg,#e6e9ed 25%,#0000 25%),linear-gradient(-45deg,#e6e9ed 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#e6e9ed 75%),linear-gradient(-45deg,#0000 75%,#e6e9ed 75%);background-position:0 0,0 7px,7px -7px,-7px 0;background-size:14px 14px;border:1px solid #d7dee7;border-radius:8px;place-items:center;min-height:260px;padding:16px;display:grid;overflow:auto}.banner-editor-canvas{touch-action:none;width:min(100%,780px);min-width:280px;position:relative;overflow:hidden;box-shadow:0 2px 12px #14203024;container-type:inline-size}.banner-editor-object{-webkit-user-select:none;user-select:none}.banner-editor-inspector{border-left:1px solid #e5e9ef;min-width:0;padding-left:16px;position:sticky;top:0}.banner-editor-inspector-heading{justify-content:space-between;align-items:center;min-height:32px;margin-bottom:14px;display:flex}.banner-editor-fields{width:100%}.banner-editor-fields>label,.banner-editor-number-grid label{color:#596579;gap:6px;font-size:12px;display:grid}.banner-editor-fields .ant-input-number{width:100%}.banner-editor-number-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.banner-editor-color,.banner-editor-background-control input[type=color]{background:#fff;border:1px solid #d9dfe7;border-radius:4px;width:44px;height:32px;padding:2px}.banner-editor-background-control{align-items:center;gap:10px;margin-top:12px;display:flex}@keyframes banner-template-loading{to{background-position-x:-200%}}@media (width<=520px){.banner-template-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.banner-template-details{padding:12px}}@media (hover:none){.banner-template-delete-button{opacity:1;visibility:visible;transform:none}}@media (width<=760px){.banner-editor-layout{grid-template-columns:minmax(0,1fr)}.banner-editor-inspector{border-top:1px solid #e5e9ef;border-left:0;padding:14px 0 0;position:static}.banner-editor-canvas-wrap{min-height:180px;padding:8px}}