/* 3D model viewers (js/model-3d.js). Hidden until a model loads; the page images stay in place before that. */
.m3d[hidden]{display:none!important}
.m3d{position:relative;display:flex;flex-direction:column;background:#000;border-radius:inherit;overflow:hidden}
.m3d-stage{position:relative;width:100%;aspect-ratio:1/1;background:radial-gradient(circle at 50% 42%,#12261a 0,#05080a 70%);overflow:hidden}
.m3d-cv{position:absolute;inset:0;width:100%;height:100%;display:block}
.m3d-stage>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.m3d-on .m3d-stage>img{visibility:hidden}
.m3d-pad{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;background:transparent;cursor:grab;touch-action:pan-y;-webkit-tap-highlight-color:transparent;z-index:5}
.m3d-drag .m3d-pad{cursor:grabbing}
.m3d-pad:focus-visible{outline:3px solid #fff;outline-offset:-3px;box-shadow:inset 0 0 0 6px #39ff6a}
.m3d-fx{z-index:4}
.m3d-bar{display:flex;align-items:center;justify-content:space-between;gap:.4rem;width:100%;background:#000;color:#e6f5e9;padding:4px;font:700 .9rem/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.m3d-b{min-width:44px;min-height:44px;background:#000;color:#39ff6a;border:2px solid #2c5a35;font:700 1rem/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;cursor:pointer;padding:0 .6rem}
.m3d-b:focus-visible{outline:3px solid #39ff6a;outline-offset:2px}
.m3d-name{flex:1;text-align:center}.m3d-name::before{content:"\21BB  drag to turn";display:block;font-weight:400;font-size:.75rem;color:#9fb5a4}
.m3d-cap{font-size:.85rem;color:#c9d6cc;margin:0;padding:.4rem 6px .5rem;background:#000}
