body{margin:0;background:#fff;color:#263247;font-family:Arial,sans-serif}.dp-content{max-width:1800px;margin:auto;padding:20px 28px}#websiteDesignManagementRoot.dw-editor-only .dp-content>.dp-store-header{display:block;width:100%;max-width:1600px;margin:0 auto 24px;background:#fff;color:#39445c;padding:0;border:0}
.dw .dp-store-header a{text-decoration:none;color:inherit}
.dw .dp-store-header-top{position:relative;min-height:124px;border-bottom:1px solid #dfe4ed;display:flex;justify-content:center;align-items:flex-start;padding:12px 0 24px;box-sizing:border-box}
.dw .dp-store-header-logo{display:block;width:290px;max-width:44%;margin:0 auto}
.dw .dp-store-header-logo img{display:block;width:100%;height:auto}
.dw .dp-store-member{position:absolute;bottom:8px;right:0;display:flex;align-items:center}
.dw .dp-store-member a{display:flex;align-items:center;min-height:27px;padding:0 9px;border-left:1px solid #dfe4ed;font-size:11px;font-weight:700;color:#59657d;white-space:nowrap}
.dw .dp-store-member a:first-child{border-left:0}
.dw .dp-store-navigation{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:24px 0 8px}
.dw .dp-store-navigation a{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:64px;border-left:1px solid #dfe4ed;text-align:center}
.dw .dp-store-navigation a:first-child{border-left:0}
.dw .dp-store-navigation strong{font-size:18px;line-height:1.3;font-weight:750}
.dw .dp-store-navigation small{font-size:11px;letter-spacing:1.3px;color:#687181}
.dw .dp-store-header a:hover{color:#24468d}
.dw .dp-store-header a:focus-visible{outline:2px solid #4166ed;outline-offset:3px}
@media(max-width:720px){.dw .dp-store-header-top{min-height:132px;padding-bottom:40px}.dw .dp-store-header-logo{width:240px;max-width:75%}.dw .dp-store-member{left:0;right:0;justify-content:center}.dw .dp-store-member a{font-size:10px;padding:0 7px}.dw .dp-store-navigation{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 0;padding-top:18px}.dw .dp-store-navigation a:nth-child(4){border-left:0}.dw .dp-store-navigation strong{font-size:15px}.dw .dp-store-navigation small{font-size:9px}}
.gallery{columns:220px;column-gap:18px}.gallery-card{display:block;break-inside:avoid;margin:0 0 18px;border-radius:15px;overflow:hidden;transition:transform .18s,box-shadow .18s}.gallery-card:hover{transform:translateY(-3px);box-shadow:0 7px 22px #19243a22}.gallery-card:focus-visible{outline:3px solid #446aff;outline-offset:3px}.gallery-card img{display:block;width:100%;height:100%;object-fit:contain;padding:12%;box-sizing:border-box}.gallery-status{text-align:center;color:#6d7585}@media(max-width:600px){.dp-content{padding:14px}.gallery{columns:2;column-gap:12px}.gallery-card{margin-bottom:12px;border-radius:10px}}
/* Image requests begin only at viewport intersection; dimensions stay reserved. */
.gallery-card img{opacity:0;transition:opacity 450ms ease}.gallery-card img.is-loaded{opacity:1}.gallery-card.image-error img{opacity:1}@media(prefers-reduced-motion:reduce){.gallery-card img{transition:none}}

/* Gallery delete control: separate button from the edit link. */
.gallery-card{position:relative}.gallery-edit{display:block;width:100%;height:100%;color:inherit;text-decoration:none}.gallery-edit:focus-visible{outline:3px solid #446aff;outline-offset:-3px;border-radius:inherit}
.gallery-delete{position:absolute;top:8px;right:8px;z-index:2;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:1px solid #f7c8ce;border-radius:50%;background:#fff4f5;color:#e32b45;font:700 26px/1 Arial,sans-serif;box-shadow:0 2px 7px #19243a22;cursor:pointer}.gallery-delete:hover{background:#ffe1e6;color:#bd1530}.gallery-delete:focus-visible{outline:3px solid #315bce;outline-offset:2px}.gallery-delete:disabled{opacity:.55;cursor:wait}
/* Category controls are shared by the top row and both persistent side panels. */
#websiteDesignManagementRoot .gallery-category{gap:5px;padding:5px 9px;box-sizing:border-box}
#websiteDesignManagementRoot .gallery-category button{color:inherit;font:inherit;font-weight:700;border:0;background:transparent;cursor:pointer}
#websiteDesignManagementRoot .gallery-category-label{padding:5px 2px}
#websiteDesignManagementRoot .gallery-category-label[aria-pressed=true]{color:inherit;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
#websiteDesignManagementRoot .gallery-category-gear,#websiteDesignManagementRoot .gallery-category-remove{flex:0 0 26px;width:26px;min-height:28px;padding:0;font-size:20px;border-radius:6px}
#websiteDesignManagementRoot .gallery-category button:hover{background:#80808022}
#websiteDesignManagementRoot .gallery-category-remove:disabled{opacity:.25;cursor:not-allowed}
.gallery-category-add{padding:10px 16px;border:1px dashed #8ba4d7;border-radius:24px;background:#f2f6ff;color:#2855d9;font:inherit;font-weight:700;cursor:pointer}
.gallery-category-sidebar{display:none}
@media(min-width:1100px){.dp-content{max-width:1800px;margin-left:218px;margin-right:218px;padding:20px 20px}.gallery-category-sidebar{display:flex;flex-direction:column;position:fixed;top:18px;bottom:18px;width:198px;z-index:5;border:1px solid #dce3ed;border-radius:14px;padding:12px 8px;box-sizing:border-box;background:#ffffffed;box-shadow:0 4px 16px #2632470b}.gallery-category-sidebar.is-left{left:10px}.gallery-category-sidebar.is-right{right:10px}.gallery-category-sidebar>strong{padding:3px 8px 12px;font-size:15px}.gallery-category-sidebar nav{overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:6px;scrollbar-width:thin}.gallery-category-sidebar .gallery-category{width:100%;flex-shrink:0;border:1px solid #d9dfeb;border-radius:12px;display:flex;align-items:center;font-size:12px}.gallery-category-sidebar input{width:16px;height:16px;accent-color:#2855d9;flex-shrink:0;cursor:pointer}.gallery-category-sidebar .gallery-category-label{flex:1;min-width:0;text-align:left;overflow-wrap:anywhere}.gallery-category-sidebar .gallery-category-add{font-size:12px;padding:10px 4px}.gallery-category-sidebar .gallery-category-gear,.gallery-category-sidebar .gallery-category-remove{flex-basis:22px!important;width:22px!important}}
@media(min-width:2260px){.dp-content{margin-left:auto;margin-right:auto}}
.gallery-category-dialog{width:min(420px,calc(100vw - 50px));border:1px solid #dce3ed;border-radius:16px;padding:24px;box-shadow:0 20px 70px #14234040;color:#263247}.gallery-category-dialog::backdrop{background:#14234066}.gallery-category-dialog h2{font-size:21px;margin:0 0 20px}.gallery-category-dialog label{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:16px 0;font-weight:700}.gallery-category-dialog input[name=name]{width:65%;box-sizing:border-box;padding:10px;border:1px solid #bdc9db;border-radius:8px;font:inherit}.gallery-category-dialog input[type=color]{width:80px;height:40px;border:1px solid #bdc9db;border-radius:8px;padding:3px;background:white}.category-swatches{display:flex;gap:9px;flex-wrap:wrap}.category-swatches button{width:30px;height:30px;border:1px solid #aebbd0;border-radius:50%;cursor:pointer}.category-preview{padding:14px;border-radius:10px;border:1px solid #dce3ed;font-weight:700;text-align:center;overflow-wrap:anywhere}.category-dialog-message{font-size:13px;color:#b42335;min-height:20px}.gallery-category-dialog footer{display:flex;justify-content:flex-end;gap:10px}.gallery-category-dialog footer button{font:inherit;font-weight:700;padding:10px 22px;border:1px solid #ccd6e6;border-radius:9px;background:white;cursor:pointer}.gallery-category-dialog footer button[type=submit]{background:#2855d9;color:white;border-color:#2855d9}.gallery-category-dialog button:disabled{opacity:.5;cursor:wait}
/* Category ordering and hover previews */
.gallery-category .gallery-category-handle{font-size:20px;line-height:1;width:22px;min-width:22px;padding:0;border:0;background:transparent;color:inherit;opacity:.55;cursor:grab;touch-action:none;order:-2}.gallery-category .gallery-category-handle:hover,.gallery-category .gallery-category-handle:focus-visible{opacity:1}.category-dragging,.category-dragging *{cursor:grabbing!important;user-select:none}.gallery-category.drop-before{box-shadow:-4px 0 #2855d9}.gallery-category.drop-after{box-shadow:4px 0 #2855d9}.gallery-category-sidebar .gallery-category.drop-before{box-shadow:0 -4px #2855d9}.gallery-category-sidebar .gallery-category.drop-after{box-shadow:0 4px #2855d9}.gallery-category-sidebar .gallery-category{gap:3px}.gallery-category-sidebar .gallery-category-handle{min-width:16px;width:16px;font-size:18px}.gallery-category-sidebar .gallery-category-gear,.gallery-category-sidebar .gallery-category-remove{min-width:20px;width:20px}
.gallery-hover-preview{position:fixed;z-index:3000;width:min(440px,calc(100vw - 24px));max-height:min(560px,calc(100vh - 24px));overflow:auto;padding:16px;box-sizing:border-box;background:#fff;border:1px solid #dce3ed;border-radius:14px;box-shadow:0 12px 36px #17223830;color:#172238;overscroll-behavior:contain}.gallery-hover-preview[hidden]{display:none}.gallery-hover-preview>strong{font-size:15px}.gallery-hover-preview>p{font-size:12px;color:#64748b;margin:8px 0 12px}.gallery-hover-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.gallery-hover-images figure{margin:0;min-width:0;padding:5px;background:#eef1f6;border-radius:8px}.gallery-hover-images img{width:100%;height:100px;object-fit:contain;display:block}.gallery-hover-images figcaption{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;margin-top:4px}
#websiteDesignManagementRoot .gallery-category .gallery-category-handle{cursor:grab;font-size:20px;line-height:1;padding:0}#websiteDesignManagementRoot .gallery-category-sidebar .gallery-category-handle{font-size:18px}

/* Parent-owned subcategory drop targets remain reachable while sorting the gallery. */
.gallery-subcategories{position:sticky;top:0;z-index:30;margin:0 0 22px;padding:16px;background:rgba(255,255,255,.97);border:1px solid #dce3ef;border-radius:14px;box-shadow:0 4px 16px #17223812}
.gallery-subcategories[hidden]{display:none}.gallery-subcategories header{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;color:#34425c}.gallery-subcategories header span{font-size:13px;color:#6b7890}.gallery-subcategory-boxes{display:flex;gap:12px;flex-wrap:wrap;align-items:stretch}.gallery-subcategory-box{position:relative;display:flex;flex-direction:column;justify-content:center;min-width:150px;min-height:106px;border:2px dashed #c6d2e8;border-radius:10px;padding:12px 32px 12px 12px;text-align:center}.gallery-subcategory-box small{font-size:12px;margin-top:12px;opacity:.7}.gallery-subcategory-box button{color:inherit;background:none;border:0;cursor:pointer}.gallery-subcategory-filter{font:inherit;font-weight:700;padding:8px}.gallery-subcategory-filter[aria-pressed=true]{text-decoration:underline;text-underline-offset:5px}.gallery-subcategory-gear{position:absolute;right:7px;top:7px}.gallery-subcategory-all,.gallery-subcategory-add{min-width:125px;min-height:106px;padding:14px;background:#f7f9fe;border:2px dashed #c6d2e8;border-radius:10px;color:#315bce;font:inherit;font-weight:700;cursor:pointer}.gallery-subcategory-all[aria-pressed=true]{border-style:solid}.gallery-subcategory-box.is-drop-target{outline:4px solid #315bce;outline-offset:2px;border-style:solid;transform:scale(1.02)}.gallery-design-drag-ghost{position:fixed;z-index:9999;pointer-events:none;width:100px;height:100px;border:2px solid #315bce;background:#f3f5fa;border-radius:10px;padding:8px;box-shadow:0 8px 24px #17223840}.gallery-design-drag-ghost img{width:100%;height:100%;object-fit:contain}.is-design-dragging{opacity:.4}.design-dragging{user-select:none;cursor:grabbing}.gallery-card .gallery-edit{touch-action:pan-y}
@media(max-width:600px){.gallery-subcategories{padding:10px}.gallery-subcategory-box,.gallery-subcategory-all,.gallery-subcategory-add{min-width:110px;min-height:90px}.gallery-subcategory-boxes{gap:8px}}

/* Gallery multi-selection is application state, separate from browser image selection. */
.gallery-selection-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;padding:12px 16px;border:1px solid #dce3ef;border-radius:10px;background:#f7f9fe;color:#34425c}.gallery-selection-bar[hidden]{display:none}.gallery-selection-bar button{padding:8px 12px;background:white;border:1px solid #c6d2e8;border-radius:7px;color:#315bce;font-weight:700;cursor:pointer}.gallery-selection-bar span{font-size:13px;color:#68768d}.gallery-selection-bar button:disabled{opacity:.5;cursor:wait}.gallery-select{display:none;position:absolute;top:10px;left:10px;z-index:4;width:30px;height:30px;align-items:center;justify-content:center;border-radius:7px;background:#ffffffee;box-shadow:0 1px 5px #17223830;cursor:pointer}.can-bulk-classify .gallery-select{display:flex}.gallery-select input{width:21px;height:21px;margin:0;accent-color:#315bce;cursor:pointer}.gallery-card.is-selected{outline:4px solid #315bce;outline-offset:-4px;box-shadow:0 0 0 2px white}.gallery-card img{user-select:none;-webkit-user-drag:none}.gallery-drag-count{position:absolute;right:-8px;top:-8px;border-radius:20px;background:#315bce;color:white;padding:6px 12px;font-size:15px;box-shadow:0 2px 5px #17223840}
/* Keep card selection reachable below sticky targets on short/narrow screens. */
.gallery-subcategories{box-sizing:border-box;max-height:38vh;overflow-y:auto;scroll-padding:8px}.gallery-subcategory-box{box-sizing:border-box;min-width:120px;width:145px;min-height:94px;padding:10px 26px 10px 10px}.gallery-subcategory-all,.gallery-subcategory-add{min-width:110px;min-height:94px;padding:10px}.gallery-subcategory-box small{margin-top:8px}

.gallery-view-bar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 18px;color:#34425c}.gallery-view-bar strong{margin-right:4px}.gallery-view-bar button{padding:9px 13px;border:1px solid #c6d2e8;border-radius:7px;background:#fff;color:#315bce;font-weight:700;cursor:pointer}.gallery-view-bar button[aria-pressed=true]{background:#315bce;color:#fff;border-color:#315bce}.gallery-view-bar button:focus-visible{outline:3px solid #87a5ff;outline-offset:2px}.gallery-view-bar span{font-size:12px;color:#68768d;margin-left:4px}
.gallery[data-view=square-black] .gallery-card{background:#000!important}.gallery[data-view=square-white] .gallery-card{background:#fff!important;border:1px solid #dce3ef}.gallery[data-view^=square] .gallery-card{border-radius:4px;aspect-ratio:1!important}.gallery[data-view^=square] .gallery-card img{padding:8%;object-fit:contain}.gallery[data-view^=square] .gallery-select{top:2px;left:2px;width:18px;height:18px;border-radius:3px}.gallery[data-view^=square] .gallery-select input{width:14px;height:14px}.gallery[data-view^=square] .gallery-delete{top:2px;right:2px;width:18px;height:18px;font-size:17px}.gallery[data-view^=square] .gallery-card.is-selected{outline-width:3px;outline-offset:-3px}

/* Customer browsing controls only. */
.gallery-categories>p:not(.gallery-totals),.gallery-category-add,.gallery-subcategory-add,.gallery-subcategory-gear,.gallery-subcategory-box small,.gallery-selection-bar,.gallery-select,.gallery-category-handle,.gallery-category-gear,.gallery-category-remove,.gallery-delete,.gallery-category input{display:none!important;}
.gallery-card{cursor:default!important;}.gallery-subcategory-box{border-style:solid!important;}

/* Remove customer left navigation and reclaim its space. */
@media(min-width:1100px) and (max-width:2259px){.dp-content{margin-left:20px;}}

/* View and sorting share one customer toolbar. */
.customer-browse-controls{display:flex;align-items:center;gap:18px;flex-wrap:nowrap;overflow-x:auto;margin:0 0 18px;padding-bottom:4px;}
.customer-browse-controls .gallery-view-bar,.customer-browse-controls .gallery-sort-bar{display:flex;align-items:center;flex-wrap:nowrap;flex:none;margin:0;white-space:nowrap;}
.customer-browse-controls .gallery-view-bar>span,.customer-browse-controls .gallery-sort-bar>span{display:none;}
.customer-browse-controls button{white-space:nowrap;}

/* Customer category navigation omits registration counts. */
.gallery-totals{display:none!important;}

/* Category navigation and stationary image zoom, shared by both galleries. */
#websiteDesignManagementRoot .gallery-category{border-radius:4px!important;background:#315bce!important;color:#fff!important;border-color:#315bce!important;transition:background .2s ease,box-shadow .2s ease}
#websiteDesignManagementRoot .gallery-category:hover{background:#2548a8!important;box-shadow:0 3px 12px #315bce33}
#websiteDesignManagementRoot .gallery-category button{color:#fff!important}
.gallery-hover-submenu{display:flex;flex-direction:column;gap:6px;animation:category-menu-in .16s ease}
.gallery-hover-submenu button{border:0;border-radius:4px;padding:12px 16px;text-align:left;background:#315bce;color:#fff;font:inherit;font-weight:700;cursor:pointer;transition:background .2s ease}
.gallery-hover-submenu button:hover,.gallery-hover-submenu button:focus-visible{background:#2548a8}
.gallery-card:hover{transform:none}
.gallery-card img{transition:opacity 450ms ease,transform 220ms ease;transform-origin:center}
@keyframes category-menu-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.gallery-card img,.gallery-category,.gallery-hover-submenu button{transition:none}.gallery-hover-submenu{animation:none}}

/* Keep card geometry fixed; pulse only the contained design artwork. */
.gallery-card{position:relative;transform:none!important;animation:none!important;transition:box-shadow 220ms ease}
.gallery-card:hover{box-shadow:0 8px 24px #19243a33}
.gallery-card:hover img{transform:none;animation:gallery-design-jelly 420ms ease-out both}
@keyframes gallery-design-jelly{0%,100%{transform:scale(1)}45%{transform:scale(1.095)}72%{transform:scale(.98)}88%{transform:scale(1.025)}}
@media(prefers-reduced-motion:reduce){.gallery-card{transition:none}.gallery-card:hover img{animation:none;transform:none}}

/* Compact desktop category rails beside the design area. */
@media(min-width:1100px){.dp-content{max-width:1800px;margin-left:20px;margin-right:176px;padding-left:12px;padding-right:12px}.gallery-category-sidebar{width:148px;top:18px;bottom:18px;padding:10px 6px;border-radius:8px}.gallery-category-sidebar .gallery-category{font-size:12px;padding:5px 6px!important}.gallery-category-sidebar .gallery-category-label{padding:6px 0}.gallery-category-sidebar>strong{padding:3px 5px 10px}}
@media(min-width:2192px){.dp-content{margin-left:auto;margin-right:auto}}
@media(max-width:1099px){.gallery-category-sidebar{display:none!important}}

/* Alternate solid gray tones by the visible design order. */
.gallery[data-view=square-checker] .gallery-card{background:var(--gallery-neutral-background,#bdbdbd)!important;background-image:none!important;background-size:auto!important;border:1px solid #cbd0d8}

/* A compact, calm search panel shared by the admin and customer galleries. */
.gallery-search-bar{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px 8px;width:100%;max-width:720px;box-sizing:border-box;margin:24px auto 28px;padding:18px 20px;border:1px solid #dce2eb;border-radius:14px;background:#f7f9fc;box-shadow:0 3px 12px #1c2e4d06;transition:border-color .18s,box-shadow .18s}
.gallery-search-bar:focus-within{border-color:#96acd8;box-shadow:0 0 0 3px #315bce0c}
.gallery-search-bar .gallery-search-heading{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700;line-height:1.4;color:#263750;cursor:text}
.gallery-search-heading:before{content:"";width:17px;height:17px;flex:none;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6e8c' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E")}
.gallery-search-bar input[type=search]{min-width:0!important;width:100%;height:46px;box-sizing:border-box;padding:11px 14px!important;border:1px solid #cbd5e3!important;border-radius:9px!important;background:#fff;color:#263750;font-size:15px!important;line-height:1.4;outline:none;transition:border-color .18s,box-shadow .18s}
.gallery-search-bar input[type=search]::placeholder{color:#8995a8;opacity:1}
.gallery-search-bar input[type=search]:focus{border-color:#4a6cb8!important;box-shadow:0 0 0 2px #315bce14}
.gallery-search-bar button{height:46px;box-sizing:border-box;padding:0 17px;border-radius:9px;white-space:nowrap;font-size:14px;transition:background .15s,border-color .15s}
.gallery-search-bar button[type=submit]{background:#3456ac;border-color:#3456ac;color:#fff}
.gallery-search-bar button[type=submit]:hover{background:#28468f;border-color:#28468f}
.gallery-search-bar button[type=button]{background:#fff;border-color:#d4dce8;color:#65748b;font-weight:600}
.gallery-search-bar button[type=button]:hover{background:#edf1f7;border-color:#bac7da}
.gallery-search-bar>label:not(.gallery-search-heading),.gallery-search-bar>[role=status]{grid-column:1/-1;font-size:12px!important;line-height:1.6;color:#77859a!important}
.gallery-search-bar>[role=status]:empty{display:none}
@media(max-width:560px){.gallery-search-bar{grid-template-columns:1fr 1fr;padding:16px;margin:18px auto 22px;gap:10px}.gallery-search-bar input[type=search]{grid-column:1/-1}.gallery-search-bar button{width:100%}}

/* Keep subcategory menus compact without changing image preview widths. */
.gallery-hover-preview:has(>.gallery-hover-submenu){width:min(240px,calc(100vw - 24px));padding:12px}
.gallery-hover-submenu button{white-space:normal;overflow-wrap:anywhere}

/* Compact icon-only view and sort controls at the right edge. */
.customer-browse-controls{width:100%;box-sizing:border-box;justify-content:flex-end;gap:12px;padding-bottom:0;overflow:visible}
.customer-browse-controls .gallery-view-bar{gap:5px}
.customer-browse-controls .gallery-view-bar>strong,.customer-browse-controls .gallery-view-bar>span{display:none}
.customer-browse-controls .gallery-sort-bar{padding-left:12px;border-left:1px solid #dce2eb}
.customer-browse-controls button{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;min-width:36px;padding:0;border-radius:8px;line-height:1;color:#62738c;border-color:#d6deeb;box-sizing:border-box}
.customer-browse-controls button svg{display:block;pointer-events:none}
.customer-browse-controls button:hover{background:#eef2fa;border-color:#aebed9}
.customer-browse-controls button[aria-pressed=true]{background:#315bce;color:#fff;border-color:#315bce}
@media(max-width:360px){.customer-browse-controls{gap:8px}.customer-browse-controls button{width:32px;height:32px;min-width:32px}.customer-browse-controls .gallery-sort-bar{padding-left:8px}}

/* Style filters at left, view/sort controls at right on the same row. */
.customer-browse-controls{align-items:center;flex-wrap:nowrap;gap:12px;overflow-x:auto}
.customer-browse-controls .gallery-style-groups{margin-right:auto;gap:8px;flex:0 0 auto}
.customer-browse-controls .gallery-style-groups button{width:auto;min-width:0;height:36px;padding:0 13px;white-space:nowrap;color:#315bce}
.customer-browse-controls .gallery-style-groups button[aria-pressed=true]{color:#fff}

/* Search hint and magnifier inside the field. */
#websiteDesignManagementRoot .gallery-search-bar input[type="search"]{padding-left:38px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2362738c' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m16 16 5 5'/%3E%3C/svg%3E");background-position:12px center;background-repeat:no-repeat;background-size:20px 20px}

/* Category tabs followed by view/sort icons, aligned from the left. */
#websiteDesignManagementRoot .gallery-categories{display:grid;grid-template-columns:max-content max-content;justify-content:start;align-items:center;column-gap:16px;overflow-x:auto;text-align:left;padding-left:0;padding-right:0}
#websiteDesignManagementRoot .gallery-categories>nav{justify-content:flex-start;flex-wrap:nowrap}
#websiteDesignManagementRoot .gallery-categories>p{grid-column:1 / -1}
#websiteDesignManagementRoot .gallery-categories>.customer-browse-controls{width:auto;margin:0;justify-content:flex-start;overflow:visible}

/* Categories left, view/sort icons at the right edge of the same row. */
#websiteDesignManagementRoot .gallery-categories{grid-template-columns:minmax(max-content,1fr) max-content}
#websiteDesignManagementRoot .gallery-categories>.customer-browse-controls{justify-self:end;justify-content:flex-end}

/* Right category rail: 15 percent narrower with centered labels. */
@media(min-width:1100px){#websiteDesignManagementRoot .gallery-category-sidebar.is-right{width:125.8px}}
#websiteDesignManagementRoot .gallery-category-sidebar.is-right>strong{text-align:center}
#websiteDesignManagementRoot .gallery-category-sidebar.is-right .gallery-category-label{text-align:center}
#websiteDesignManagementRoot .gallery-category-sidebar.is-right .gallery-category{justify-content:center}

/* Card layouts with fixed neutral backgrounds; masonry geometry is shared. */
.gallery[data-view=card-white] .gallery-card{background:#fff!important;background-image:none!important;border:1px solid #dce3ef}
.gallery[data-view=card-black] .gallery-card{background:#000!important;background-image:none!important}
.gallery[data-view=card-gray] .gallery-card{background:var(--gallery-card-gray,#909090)!important;background-image:none!important}

/* Jelly motion for the category icon only */
@keyframes gallery-category-jelly{0%,100%{transform:scale(1)}45%{transform:scale(1.055)}72%{transform:scale(.98)}88%{transform:scale(1.015)}}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:is(:hover,:focus-within) .customer-category-icon{animation:gallery-category-jelly 380ms ease-out both;transform-origin:center}
@media(prefers-reduced-motion:reduce){#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:is(:hover,:focus-within) .customer-category-icon{animation:none}}
#websiteDesignManagementRoot .gallery-search-bar>[role=status]{text-align:center;width:100%;box-sizing:border-box}

/* View controls left, category buttons right */
#websiteDesignManagementRoot .gallery-categories{grid-template-columns:max-content minmax(max-content,1fr)}
#websiteDesignManagementRoot .gallery-categories>.customer-browse-controls{grid-column:1;grid-row:1;justify-self:start;justify-content:flex-start}
#websiteDesignManagementRoot .gallery-categories>nav{grid-column:2;grid-row:1;justify-self:end;justify-content:flex-end}

/* Search between view controls and category buttons */
#websiteDesignManagementRoot .gallery-categories{grid-template-columns:max-content minmax(300px,1fr) max-content;column-gap:16px}
#websiteDesignManagementRoot .gallery-categories>.customer-browse-controls{grid-column:1;grid-row:1;justify-self:start}
#websiteDesignManagementRoot .gallery-categories>.gallery-search-bar{grid-column:2;grid-row:1;width:100%;max-width:none;min-width:0;margin:0;box-sizing:border-box;padding:10px}
#websiteDesignManagementRoot .gallery-categories>nav{grid-column:3;grid-row:1;justify-self:end}
@media(min-width:1100px){
#websiteDesignManagementRoot .gallery-category-sidebar.is-right{justify-content:center}
#websiteDesignManagementRoot .gallery-category-sidebar.is-right>strong{flex:0 0 auto}
#websiteDesignManagementRoot .gallery-category-sidebar.is-right>nav{flex:0 1 auto;min-height:0}
}

#websiteDesignManagementRoot .customer-browse-controls .gallery-view-bar{display:grid;grid-template-columns:repeat(2,max-content);gap:8px;flex:none}

/* Square icon category menu matched to the adjacent search/view controls */
#websiteDesignManagementRoot .gallery-categories>nav{gap:8px;align-items:center}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category{width:var(--customer-category-size,80px);height:var(--customer-category-size,80px);min-width:var(--customer-category-size,80px);padding:0!important;flex:none;border-radius:10px!important;box-sizing:border-box}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;height:100%;padding:6px!important;text-align:center;font-size:11px;line-height:1.25;box-sizing:border-box;white-space:normal;overflow-wrap:normal}
#websiteDesignManagementRoot .customer-category-icon{display:block;width:26px;height:26px;flex:none}
#websiteDesignManagementRoot .customer-category-icon svg{display:block;width:100%;height:100%}
#websiteDesignManagementRoot :is(.gallery-hover-submenu,.gallery-subcategories){display:none!important}

/* Customer square categories: blue at rest, white on rollover; icon-only jelly. */
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category{background:#315bce!important;color:#fff!important;border:1px solid #315bce!important;box-shadow:0 3px 9px #1739660b;transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease;animation:none!important;transform:none!important;--customer-icon-cutout:#315bce}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label{color:inherit!important;background:transparent!important;border-radius:inherit;outline-offset:3px;transition:color .18s ease}
#websiteDesignManagementRoot .gallery-categories>nav .customer-category-icon{width:34px;height:34px;max-width:40%;color:#fff;transition:color .18s ease}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:has(.gallery-category-label[aria-pressed=true]){border-color:#94b7ff!important;box-shadow:0 0 0 2px #94b7ff,0 3px 12px #2965f326}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label[aria-pressed=true]{color:#fff!important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:is(:hover,:focus-within){background:#fff!important;color:#172b50!important;border-color:#2965f3!important;box-shadow:0 5px 14px #315bce33;--customer-icon-cutout:#fff}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:is(:hover,:focus-within) .gallery-category-label{color:#172b50!important}
#websiteDesignManagementRoot .gallery-categories>nav .gallery-category:is(:hover,:focus-within) .customer-category-icon{color:#1260f4}
@media(prefers-reduced-motion:reduce){#websiteDesignManagementRoot .gallery-categories>nav :is(.gallery-category,.gallery-category-label,.customer-category-icon){transition:none}}

/* Toolbar edge spacing retained for focus outlines. */
#websiteDesignManagementRoot .gallery-categories>nav{padding:0 max(8px,calc(var(--customer-category-size,80px) * .04));box-sizing:border-box}

/* Remove the outer frame of the customer category rail. */
#websiteDesignManagementRoot .gallery-category-sidebar.is-right{border:0;box-shadow:none}

/* One plain loading message, with no manual loading controls. */
#websiteDesignManagementRoot .gallery-status{font-size:20px;font-weight:600;line-height:1.5;text-align:center;margin:36px auto;color:#68768d}
#websiteDesignManagementRoot .gallery-status:empty{display:none}

/* Expose the live category registry as touch-friendly child filters. */
#websiteDesignManagementRoot#websiteDesignManagementRoot .customer-subcategories:not([hidden]){display:flex!important;position:static;align-items:center;gap:14px;flex-wrap:wrap;margin:12px 0 18px;padding:12px 16px;max-height:none;overflow:visible;background:#f6f8ff;border:1px solid #dce3ef;border-radius:12px;box-shadow:none}
#websiteDesignManagementRoot .customer-subcategories[hidden]{display:none!important}
#websiteDesignManagementRoot .customer-subcategories>strong{font-size:14px;color:#234997}
#websiteDesignManagementRoot .customer-subcategories>nav{display:flex;gap:8px;flex-wrap:wrap;min-width:0}
#websiteDesignManagementRoot .customer-subcategories>nav button{min-height:44px;padding:9px 15px;border:1px solid #cbd7ee;background:white;color:#234997;border-radius:8px;font:inherit;cursor:pointer}
#websiteDesignManagementRoot .customer-subcategories>nav button[aria-pressed=true]{background:#3157d0;color:white;border-color:#3157d0}
@media(max-width:700px){#websiteDesignManagementRoot#websiteDesignManagementRoot .customer-subcategories:not([hidden]){gap:8px;padding:10px}#websiteDesignManagementRoot .customer-subcategories>nav button{padding:8px 12px}}

/* Stack search above categories before their combined width becomes cramped. */
#websiteDesignManagementRoot .dp-content{container-type:inline-size;container-name:public-gallery-layout}
@media(min-width:761px){
 @container public-gallery-layout (max-width:1600px){
  #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:16px;width:100%;min-width:0;overflow:visible;padding:0 0 12px}
  #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>.customer-browse-controls{grid-column:1;grid-row:1;align-self:center}
  #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>.gallery-search-bar{grid-column:2;grid-row:1;width:100%;max-width:none;min-width:0;margin:0}
  #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav{grid-column:1/-1;grid-row:2;display:flex;flex-wrap:wrap;justify-content:center;justify-self:stretch;width:100%;min-width:0;gap:8px;padding:4px;overflow:visible;box-sizing:border-box}
  #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav .gallery-category{width:80px;height:80px;min-width:80px}
 }
}

/* Maintenance changes below are MOBILE ONLY; desktop uses the original CSS. */
@media(max-width:760px){

/* Mobile UX 20261009: compact navigation, no outer gutters. */
@media(max-width:760px){
html body #websiteDesignManagementRoot#websiteDesignManagementRoot{width:100%;max-width:none;margin:0;padding:0!important;background:#fff}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .dp-content{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;min-width:0;box-sizing:border-box}
html body .dw .dp-store-navigation{gap:8px 0;padding:10px 0 4px}
html body .dw .dp-store-navigation a{height:38.4px;min-height:38.4px;padding:0 3px!important;gap:3px;box-sizing:border-box}
html body .dw .dp-store-navigation strong{font-size:13px;line-height:1.2}
html body .dw .dp-store-navigation small{font-size:8px;line-height:1.2;letter-spacing:.5px}
}

@media(max-width:760px){
html body #websiteDesignManagementRoot :is(.dp-design-gallery,.gallery-content,.gallery-grid){min-width:0;max-width:100%;padding-left:0!important;padding-right:0!important;border:0;box-shadow:none}
html body #websiteDesignManagementRoot .gallery-search-bar{min-width:0;max-width:100%;flex-wrap:wrap}
html body #websiteDesignManagementRoot .gallery-search-bar input[type=search]{min-width:0!important;flex:1 1 100%!important;width:100%;font-size:16px!important}
}

}

/* Custom category symbols use the same design on desktop and mobile. */
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav .customer-category-icon-custom{color:inherit!important}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label:has(.customer-category-icon-custom){color:inherit!important}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label[aria-pressed=true]:has(.customer-category-icon-custom){color:#fff!important}
@media(max-width:760px){
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-categories>nav .gallery-category-label:has(.customer-category-icon-custom){color:#fff!important}
}

/* The active category stays lime during hover/focus, on PC and mobile. */
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-category:has(>button[data-category][aria-pressed=true]){
 background:#b6f348!important;color:#173890!important;border-color:#94ca38!important;box-shadow:0 0 0 2px #b6f34866!important;--customer-icon-cutout:#b6f348
}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot :is(.gallery-categories>nav,.gallery-category-sidebar) .gallery-category .gallery-category-label[data-category][aria-pressed=true]{
 background:#b6f348!important;color:#173890!important
}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .gallery-category:has(>button[data-category][aria-pressed=true]) .customer-category-icon{
 color:#173890!important
}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot :is(.gallery-categories>nav,.gallery-category-sidebar) .gallery-category .gallery-category-label[data-category][aria-pressed=true]::after{
 color:#173890;text-shadow:none
}
html body #websiteDesignManagementRoot#websiteDesignManagementRoot .customer-subcategories>nav button[aria-pressed=true]{
 background:#b6f348;color:#173890;border-color:#94ca38
}

/* White artwork keeps a contrasting background in PC and mobile white views. */
.gallery:is([data-view=card-white],[data-view=square-white]) .gallery-card[data-white-ink=true]{background:var(--gallery-ink-background,#606b7d)!important;background-image:none!important}

/* Desktop gallery: enlarge only the artwork; retain card layout and hover motion. */
@media(min-width:761px){.gallery-card img{scale:1.1}}

/* Shallow autumn background; original logo dimensions and masthead geometry preserved. */
.dw .dp-store-header-top.ap-autumn-background{background:#fff url('/homepage-header-autumn-20261111.png?v=white-v3') center center/cover no-repeat}
@media(max-width:720px){.dw .dp-store-header-top.ap-autumn-background{background-size:auto 100%}}
