.m3d{align-items:start;gap:clamp(18px,3vw,36px);display:grid}.m3d>*{min-width:0}.m3d.page{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.m3d.page .stage{height:clamp(420px,60vh,620px)}.m3d.hero{grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}.m3d.hero .m3d-copy{grid-area:1/1}.m3d.hero .info{grid-area:2/1}.m3d.hero .stage{grid-area:1/2/3;height:min(78vh,720px);position:sticky;top:86px}@media (width<=960px){.m3d.page,.m3d.hero{grid-template-rows:none;grid-template-columns:minmax(0,1fr)}.m3d.hero .m3d-copy,.m3d.hero .info,.m3d.hero .stage{grid-area:auto/1;position:static}.m3d.hero .stage,.m3d.page .stage{height:clamp(360px,62vh,520px)}}.m3d .stage{isolation:isolate;contain:layout paint;border-radius:var(--r-lg);border:1px solid var(--line);background:radial-gradient(110% 70% at 50% 28%, color-mix(in srgb, var(--copper) 12%, var(--board-2)), var(--board-2) 72%), var(--board-2);box-shadow:var(--shadow-md);position:relative;overflow:hidden}.m3d .stage:before{content:"";z-index:0;pointer-events:none;background-image:radial-gradient(circle at center, var(--hole) 1.4px, transparent 2px);background-size:18px 18px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 60% at 50% 70%,#0000008c,#0000);mask-image:radial-gradient(80% 60% at 50% 70%,#0000008c,#0000)}.m3d .stage:after{content:"";z-index:0;pointer-events:none;background:linear-gradient(90deg, transparent, color-mix(in srgb, var(--copper) 45%, transparent), transparent);height:2px;position:absolute;bottom:76px;left:10%;right:10%}.m3d .stage canvas{z-index:1;touch-action:pan-y;cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}.m3d .stage canvas:active{cursor:grabbing}.m3d .stage-fallback{z-index:2;text-align:center;color:var(--ink-soft);place-items:center;padding:30px;display:none;position:absolute;inset:0}.m3d .stage-top{z-index:3;pointer-events:none;justify-content:space-between;align-items:center;gap:10px;display:flex;position:absolute;top:14px;left:16px;right:14px}.m3d .stage-top>*{pointer-events:auto}.m3d .stage-label{background:color-mix(in srgb, var(--surface) 78%, transparent);-webkit-backdrop-filter:blur(8px);border-radius:var(--r-pill);color:var(--ink);text-overflow:ellipsis;white-space:nowrap;max-width:55%;padding:8px 12px;overflow:hidden}.m3d .stage-ctl{align-items:center;gap:6px;display:flex}.m3d .ctl{border:1px solid var(--line);cursor:pointer;background:color-mix(in srgb, var(--surface) 82%, transparent);-webkit-backdrop-filter:blur(8px);width:40px;height:40px;color:var(--ink);font:700 1.1rem/1 var(--mono);transition:background var(--t-fast), transform var(--t-fast) var(--ease-out);border-radius:50%;place-items:center;display:grid}.m3d .ctl:hover{background:var(--surface);transform:translateY(-1px)}.m3d #animBtn[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--board);box-shadow:0 3px 0 var(--copper)}.m3d .stage-hint{z-index:3;color:var(--ink-soft);pointer-events:none;opacity:.9;position:absolute;bottom:82px;left:16px}.m3d[data-only] .stage-hint{bottom:16px}.m3d .tray{z-index:3;scrollbar-width:none;scroll-snap-type:x proximity;background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--board-2) 85%, transparent) 40%);gap:8px;padding:14px 16px 16px;display:flex;position:absolute;bottom:0;left:0;right:0;overflow-x:auto;-webkit-mask-image:linear-gradient(90deg,#0000,#000 24px calc(100% - 24px),#0000);mask-image:linear-gradient(90deg,#0000,#000 24px calc(100% - 24px),#0000)}.m3d .tray::-webkit-scrollbar{display:none}.m3d[data-only] .tray{display:none}.m3d .tray .chip{scroll-snap-align:center;background:color-mix(in srgb, var(--surface) 84%, transparent);-webkit-backdrop-filter:blur(8px);flex:none;min-height:40px}.m3d .tray .chip.on{background:var(--ink);color:var(--board);border-color:var(--ink)}.m3d .tray .chip i{background:var(--c,var(--copper));border-radius:50%;flex:none;width:8px;height:8px}.m3d .tray .chip.on i{box-shadow:0 0 0 2px color-mix(in srgb, var(--board) 40%, transparent)}.m3d .info{flex-direction:column;gap:14px;display:flex}.m3d .info .row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.m3d .info .tag i{background:var(--c);border-radius:50%;width:8px;height:8px;display:inline-block}.m3d .info h3{font-size:var(--step-2);letter-spacing:-.025em;font-variation-settings:"opsz" 48}.m3d .variants{flex-wrap:wrap;gap:6px;display:flex}.m3d .info dl{gap:12px;margin:0;display:grid}.m3d .info dl>div{grid-template-columns:12px minmax(0,1fr);gap:4px 12px;padding-left:2px;display:grid}.m3d .info dt{font-family:var(--display);font-weight:700;font-size:var(--step-0);letter-spacing:-.01em;grid-column:2}.m3d .info dt i{position:absolute}.m3d .info dl>div:before{content:"";background:var(--c,var(--copper));border-radius:2px;grid-area:1/1/3;justify-self:center;width:3px;height:100%}.m3d .info dd{color:var(--ink-soft);grid-column:2;margin:0}.m3d .info .warn{background:var(--rail-red-soft);border-left:3px solid var(--rail-red);border-radius:var(--r-sm);font-size:var(--step--1);padding:10px 14px}.m3d .info .extra{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.m3d .info .extra:empty{display:none}.m3d .info .extra .lbl{width:100%;font-weight:700;font-size:var(--step--1)}.m3d .swatch{border:3px solid var(--surface);width:32px;height:32px;box-shadow:0 0 0 1.5px var(--line);cursor:pointer;transition:transform var(--t-fast) var(--ease-spring);border-radius:50%}.m3d .swatch:hover{transform:scale(1.1)}.m3d .swatch[aria-pressed=true]{box-shadow:0 0 0 3px var(--ink)}.m3d .more{color:var(--copper-deep);align-self:flex-start;align-items:center;gap:.5em;padding:4px 0;font-weight:700;text-decoration:none;display:inline-flex}.m3d .more svg{width:1.1em;height:1.1em;transition:translate var(--t-med) var(--ease-spring)}.m3d .more:hover svg{translate:4px}.m3d .more:hover{color:var(--copper)}