.composer-media-panel {display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .22s ease,opacity .18s ease;min-height:0;}
.composer-media-panel.is-open {grid-template-rows:1fr;opacity:1;}
.composer-media-clip {min-height:0;overflow:hidden;}
.composer-media-content {padding:10px 2px 1px;}
.composer-media-head {display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 2px 6px;font-size:13px;line-height:18px;color:#5c5c69;}
.composer-media-head strong {font-weight:500;}
.composer-media-count {color:#91919e;font-size:12px;}
.composer-media-strip {display:flex;gap:10px;min-width:0;height:106px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#dedee5 transparent;}
.composer-media-strip[hidden] {display:none;}
.composer-media-tile {position:relative;flex:0 0 88px;height:106px;}
.composer-media-photo {display:block;width:88px;height:88px;padding:0;overflow:hidden;border:1px solid #e7e7ee;border-radius:12px;background:#f3f3f7;cursor:pointer;}
.composer-media-photo img {display:block;width:100%;height:100%;object-fit:cover;}
.composer-media-unavailable {display:block;padding:20px 6px;font-size:11px;color:#777783;line-height:1.5;}
.composer-media-check {position:absolute;right:4px;top:4px;display:flex;align-items:center;justify-content:center;min-width:26px;width:26px;height:26px;padding:0;border:1.5px solid white;border-radius:50%;background:#30303e80;color:white;font-size:12px;line-height:1;cursor:pointer;box-shadow:0 1px 4px #0002;}
.composer-media-check[aria-pressed="true"] {background:#5267df;}
.composer-media-remove {display:block;margin:0 auto;padding:0 8px;border:0;background:transparent;color:#858593;font-size:11px;line-height:18px;cursor:pointer;}
.composer-media-actions {margin-top:8px;}
.composer-media-action {display:flex;align-items:center;gap:12px;width:100%;min-height:58px;padding:9px 13px;border:1px solid #ececf2;border-radius:14px;background:#f8f8fb;color:#545462;text-align:left;cursor:pointer;transition:background .15s ease;}
.composer-media-action-text {display:flex;flex:1;min-width:0;flex-direction:column;gap:2px;}
.composer-media-action-title {font-size:13px;font-weight:500;line-height:18px;}
.composer-media-action-hint {color:#9999a7;font-size:11px;line-height:16px;}
.composer-media-action-arrow {color:#a5a5b0;font-size:22px;line-height:1;}
.composer-media-action:hover {background:#f0f1f8;}
.composer-media-action:active {background:#e9ebf5;}
.composer-media-panel button:disabled {cursor:default;opacity:.5;}
.composer-media-icon {display:flex;flex:0 0 36px;align-items:center;justify-content:center;width:36px;height:36px;padding:8px;border-radius:10px;background:#efeff7;color:#73799a;}
.composer-media-icon svg {display:block;width:100%;height:100%;}
.composer-media-toggle {position:relative;}
.composer-media-toggle .ui-icon {transition:transform .22s ease;}
.composer-media-toggle[aria-expanded="true"] .ui-icon {transform:rotate(45deg);}
.composer-media-toggle.has-photos::after {content:attr(data-selected-count);position:absolute;right:0;top:0;display:flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding:0 3px;border:2px solid white;border-radius:9px;background:#5267df;color:white;font-size:9px;line-height:1;}
.composer-media-toggle[aria-expanded="true"]::after {display:none;}
.composer-media-notice {margin:9px 2px 0;color:#8c6650;font-size:12px;line-height:1.5;}
.composer-media-foot {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:4px;font-size:11px;line-height:18px;color:#9999a7;}
.composer-media-deselect {padding:0 2px;border:0;background:transparent;color:#73738a;font-size:11px;line-height:18px;cursor:pointer;}
.composer-media-deselect:disabled {color:#b9b9c3;cursor:default;}
.composer-media-identify {padding:6px 12px;border:1px solid #e7c9b5;border-radius:9px;background:#fff8f2;color:#a85f31;font-size:12px;line-height:18px;cursor:pointer;}
.image-product-recognize {margin-top:12px;padding:9px 14px;border:1px solid #d9e0f3;border-radius:9px;background:#fff;color:#5367b2;font-size:13px;}
.composer-media-panel button:focus-visible {outline:2px solid #6574da;outline-offset:2px;}
.composer-media-panel .composer-media-check {min-height:26px;}
.composer-media-panel .composer-media-remove,.composer-media-panel .composer-media-deselect {min-height:18px;height:18px;}
[data-performer-mode="active"] .composer-media-check[aria-pressed="true"], [data-performer-mode="active"] .composer-media-toggle.has-photos::after {background:#aa6c89;}
@media (prefers-reduced-motion:reduce) {.composer-media-panel,.composer-media-toggle .ui-icon {transition:none;}}