.garam-modal * { box-sizing:border-box; }
/* Modal with separate 3D preview + card information. */
.garam-modal { position:fixed; inset:0; z-index:99999; display:flex; align-items:center;
    justify-content:center; padding:14px; background:rgba(var(--garam-rgb-062743, 6,39,67),.78);
    opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s,visibility .2s; }
.garam-modal.is-open { opacity:1; visibility:visible; pointer-events:auto; }
.garam-modal-panel { width:min(100%,1020px); max-height:calc(100dvh - 28px); overflow:auto;
    padding:18px; border-radius:22px; border:1px solid var(--garam-c-b1d8f2, #b1d8f2); background:#fff;
    box-shadow:0 24px 70px rgba(var(--garam-rgb-042543, 4,37,67),.4); }
.garam-modal-header { display:flex; align-items:center; justify-content:space-between; gap:12px;
    margin:0 1px 14px; }
.garam-modal-header h2 { margin:0; font-size:20px; font-weight:800; color:var(--garam-c-123c5c, #123c5c); }
.garam-modal-close { display:inline-flex; align-items:center; justify-content:center; gap:8px;
    flex-shrink:0; min-width:95px; min-height:42px; padding:8px 13px;
    border:1px solid var(--garam-c-8ac6ec, #8ac6ec); border-radius:12px; background:var(--garam-c-e4f5ff, #e4f5ff); color:var(--garam-c-075d94, #075d94);
    font:inherit; font-size:14px; font-weight:800; line-height:1; cursor:pointer; }
.garam-modal-close span { font-size:24px; font-weight:500; }
.garam-modal-close:hover { background:var(--garam-c-cfebfc, #cfebfc); }
.garam-modal-close:focus-visible { outline:3px solid var(--garam-c-178fda, #178fda); outline-offset:2px; }
.garam-modal-content { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(270px,.8fr);
    gap:16px; align-items:stretch; }
.garam-modal-stage { position:relative; display:flex; align-items:center; justify-content:center;
    overflow:hidden; min-height:510px; border-radius:17px;
    background:radial-gradient(circle at center,var(--garam-c-f6fcff, #f6fcff),var(--garam-c-b9e2fc, #b9e2fc)); }
#three_dimensional_target { display:block; width:100%; height:555px;
    min-height:300px; min-width:0; margin:0 auto; }
.garam-modal-fallback { position:absolute; inset:0; display:grid; place-items:center;
    background:var(--garam-c-eaf7ff, #eaf7ff); padding:18px; }
.garam-modal-fallback[hidden], .garam-modal-status[hidden] { display:none; }
.garam-modal-fallback img { max-width:100%; max-height:100%; object-fit:contain; }
.garam-modal-details { min-width:0; padding:20px; border:1px solid var(--garam-c-c4e4f7, #c4e4f7);
    border-radius:17px; background:var(--garam-c-f0f9ff, #f0f9ff); }
.garam-modal-summary { padding-bottom:12px; border-bottom:1px solid var(--garam-c-c8e5f6, #c8e5f6); }
.garam-modal-eyebrow { color:var(--garam-c-3179a8, #3179a8); font-size:12px; font-weight:800;
    letter-spacing:.06em; text-transform:uppercase; overflow-wrap:anywhere; }
.garam-modal-summary h3 { margin:6px 0 5px; font-size:25px; color:var(--garam-c-123c5c, #123c5c);
    font-weight:850; overflow-wrap:anywhere; }
.garam-modal-summary p { margin:0; color:var(--garam-c-477b9a, #477b9a); font-size:14px; overflow-wrap:anywhere; }
.garam-modal-chips { display:flex; flex-wrap:wrap; gap:7px; margin:15px 0; }
.garam-modal-chip { display:inline-flex; align-items:center; padding:7px 10px;
    border-radius:10px; background:var(--garam-c-d3edff, #d3edff); color:var(--garam-c-075d94, #075d94); font-size:12px; font-weight:800; }
.garam-modal-facts { display:grid; grid-template-columns:minmax(85px,.43fr) minmax(0,1fr);
    gap:12px 9px; margin:0; }
.garam-modal-facts dt { color:var(--garam-c-4c7e9c, #4c7e9c); font-size:13px; font-weight:700; }
.garam-modal-facts dd { min-width:0; margin:0; color:var(--garam-c-153e5b, #153e5b); font-size:13px;
    font-weight:650; overflow-wrap:anywhere; }
.garam-modal-facts a { color:var(--garam-c-0874bb, #0874bb); text-decoration:underline; text-underline-offset:2px; }
.garam-modal-status { color:var(--garam-c-477b9a, #477b9a); font-size:12px; text-align:center; margin:9px 0 0; }
@media(max-width:740px) {
    .garam-modal-content { grid-template-columns:1fr; }
    .garam-modal-panel { padding:12px; }
    .garam-modal-stage { min-height:365px; }
    #three_dimensional_target { height:430px; }
    .garam-modal-details { padding:16px; }
}
@media(max-width:460px) {
    .garam-modal-stage { min-height:280px; }
    #three_dimensional_target { height:330px; }
}
@media(prefers-reduced-motion:reduce) {
    .garam-modal { transition:none; }
}