carina-explorer{display:block}carina-explorer [hidden]{display:none!important}.explorer-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0}.explorer-tools>div{display:flex;gap:8px}carina-explorer button{font:inherit;cursor:pointer}.explorer-tools button,.explorer-detail button,.explorer-dialog button{border:1px solid #bbb;background:#ffffffdf;color:#222;border-radius:7px;min-height:44px;padding:10px 16px;font-size:13px}.explorer-tools button[aria-pressed=true]{background:#222;color:#fff;border-color:#222}.explorer-canvas{position:relative;aspect-ratio:16/9}.product-stage .explorer-canvas>#package-image{display:block;width:100%;height:100%;max-height:none;object-fit:contain;margin:0;padding:0}.explorer-dimensions,.explorer-hotspots{position:absolute;inset:0;pointer-events:none}.explorer-dimensions>span{position:absolute;padding:7px 10px;background:#ffffffed;backdrop-filter:blur(12px);border:1px solid #aaa;border-radius:6px;font-size:11px;line-height:1.4;box-shadow:0 3px 12px #0001}.explorer-dimensions strong{display:block;color:#222;font-weight:600}.dimension-length{top:2%;left:4%}.dimension-width{bottom:0;left:40%}.dimension-peak{left:3%;top:40%}.dimension-clearance{right:0;top:48%}.explorer-hotspots button{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;width:44px;height:44px;border:1px solid #fff;border-radius:50%;background:#222e;color:#fff;font-size:13px;box-shadow:0 0 0 5px #ffffff6b}.explorer-hotspots button[aria-expanded=true]{background:#fff;color:#222;border-color:#222}.explorer-dimension-note{font-size:11px;color:#646464;margin:16px 0}.explorer-detail{position:relative;display:flex;align-items:center;gap:25px;background:#ffffffd9;border:1px solid #ddd;border-radius:10px;padding:24px 52px 24px 24px;margin-top:20px;backdrop-filter:blur(20px)}.explorer-detail>div{flex:1}.explorer-detail h4{font-size:21px;margin:8px 0}.explorer-detail p{font-size:13px;line-height:1.7;color:#646464}.explorer-detail .tag{font-size:10px}.explorer-detail [data-detail-close]{position:absolute;right:5px;top:5px;padding:5px;min-width:36px;border:0;background:transparent}.explorer-dialog{width:96vw;max-width:1600px;height:94dvh;max-height:94dvh;margin:auto;padding:20px;border:1px solid #ddd;border-radius:16px;background:#fafafa;color:#222;overflow:hidden}.explorer-dialog::backdrop{background:#101010b8;backdrop-filter:blur(10px)}.explorer-dialog[open]{display:flex;flex-direction:column}.explorer-dialog-header{display:flex;justify-content:space-between;align-items:center;gap:16px}.explorer-dialog-header strong{font-size:16px}.explorer-dialog-header small{display:block;color:#646464;font-size:12px;margin-top:8px}.explorer-viewport{flex:1;min-height:0;position:relative;overflow:hidden;touch-action:none;cursor:grab;margin:15px 0;background:#fff;border-radius:10px}.explorer-viewport:active{cursor:grabbing}.explorer-viewport img{width:100%;height:100%;object-fit:contain;display:block;user-select:none;pointer-events:none;transform-origin:center}.explorer-zoom-tools{display:flex;align-items:center;justify-content:center;gap:12px}.explorer-zoom-tools output{font-size:13px;min-width:45px;text-align:center}.explorer-zoom-tools button:disabled{opacity:.4;cursor:default}.explorer-view-note{text-align:center;font-size:11px;color:#646464;margin-top:10px}carina-explorer :focus-visible{outline:3px solid #555;outline-offset:4px}
@media(max-width:760px){.explorer-tools{gap:5px}.explorer-tools button{font-size:11px;padding:9px}.explorer-tools>div{gap:5px}.explorer-dimensions>span{font-size:9px;padding:4px 5px}.dimension-length{left:0;top:0}.dimension-peak{left:0;top:45%}.dimension-width{left:37%;bottom:-8px}.dimension-clearance{right:0;top:48%}.explorer-hotspots button{width:36px;height:36px;font-size:11px;box-shadow:0 0 0 3px #ffffff80}.explorer-detail{flex-direction:column;align-items:start;padding:20px 40px 20px 20px;gap:12px}.explorer-detail h4{font-size:19px}.explorer-dialog{width:100vw;height:100dvh;max-height:100dvh;border-radius:0;padding:15px}.explorer-dialog-header strong{font-size:14px}.explorer-dialog-header small{font-size:11px}.explorer-dialog button{padding:9px 12px}.explorer-zoom-tools{padding-bottom:env(safe-area-inset-bottom)}}
