.d3{position:relative;overflow:hidden;border-top:1px solid var(--line);background:var(--bg)}.d3-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:32px 56px;align-items:center}.d3-copy .sub{margin-top:16px}.d3-copy .chips{margin-top:24px}.d3-note{margin-top:18px;font-size:13px;color:var(--muted)}.d3-viz{display:grid;justify-items:center;gap:4px;min-width:0}.d3-viz > .d3-stage{width:100%}.d3-pick{display:inline-flex;padding:4px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm)}.d3-pick[hidden]{display:none}.d3-pick button{min-height:44px;min-width:112px;padding:0 18px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-size:14.5px;font-weight:500;cursor:pointer;transition:color .25s ease,background-color .25s ease,box-shadow .25s ease}.d3-pick button:hover{color:var(--ink)}.d3-pick button[aria-checked="true"]{color:#fff;background:var(--violet);box-shadow:0 6px 16px -6px rgba(124,58,237,.55)}.d3-pick button:focus-visible{outline:2px solid var(--violet);outline-offset:2px}.d3-stage{--w0:clamp(150px,11vw + 80px,230px);--w:var(--w0);--h:calc(var(--w) * 2.0714);--d:calc(var(--w) * .227);--r:calc(var(--w) * .024);--ry:-28deg;--rx:-7deg;--lf:.0;--lb:.7;--lr:.55;--ll:.2;--gx:30%;--sw:1;position:relative;display:grid;place-items:center;min-height:calc(var(--w0) * 2.0714 + 150px);perspective:calc(var(--w0) * 7);perspective-origin:50% 40%;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;border-radius:var(--radius-lg);outline:none}.d3-stage[data-model="p"]{--w:calc(var(--w0) * 1.7045);--h:calc(var(--w) * 1.0138);--d:calc(var(--w) * .1333);--r:calc(var(--w) * .018)}.d3-stage::before{content:"";position:absolute;inset:6% 8% 14%;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(124,58,237,.16),rgba(37,99,235,.07) 55%,transparent 75%)}.d3-stage:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb,var(--violet) 45%,transparent)}.d3-stage.grabbing{cursor:grabbing}.d3-floor{position:absolute;left:50%;top:calc(50% + var(--h) / 2 + 2px);width:calc(var(--w) * 1.25);height:26px;margin-left:calc(var(--w) * -.625);border-radius:50%;background:radial-gradient(closest-side,rgba(11,16,38,.32),rgba(11,16,38,.1) 60%,transparent);transform:scaleX(var(--sw));filter:blur(4px);pointer-events:none}.d3-obj{position:relative;width:var(--w);height:var(--h);margin-top:-34px;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));will-change:transform}.d3-obj > *{position:absolute;display:block;backface-visibility:hidden;-webkit-backface-visibility:hidden}.d3-obj .shade{position:absolute;inset:0;border-radius:inherit;background:#000;pointer-events:none}.d3-front{inset:0;border-radius:var(--r);transform:translateZ(calc(var(--d) / 2))}.d3-front img{width:100%;height:100%;display:block;border-radius:inherit;-webkit-user-drag:none;pointer-events:none}.d3-front .shade{opacity:var(--lf)}.d3-front .glare{position:absolute;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:screen;background:linear-gradient(105deg,transparent calc(var(--gx) - 22%),rgba(255,255,255,.13) var(--gx),transparent calc(var(--gx) + 22%))}.d3-back{inset:0;border-radius:var(--r);transform:rotateY(180deg) translateZ(calc(var(--d) / 2));background:radial-gradient(120% 70% at 30% 20%,#26262b,#141417 60%,#0e0e10);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}.d3-back .plate{position:absolute;left:16%;right:16%;top:14%;bottom:30%;border-radius:calc(var(--r) * 1.6);background:linear-gradient(180deg,#121215,#19191d);box-shadow:inset 0 1px 3px rgba(0,0,0,.7),0 1px 0 rgba(255,255,255,.06)}.d3-back .plate::before,.d3-back .plate::after{content:"";position:absolute;left:50%;width:9%;aspect-ratio:1;margin-left:-4.5%;border-radius:50%;background:radial-gradient(circle at 40% 35%,#3a3a40,#0a0a0c 70%)}.d3-back .plate::before{top:8%}.d3-back .plate::after{bottom:8%}.d3-back .port{position:absolute;left:41%;width:18%;bottom:14%;height:4%;border-radius:3px;background:#08080a;box-shadow:inset 0 1px 2px rgba(0,0,0,.9),0 1px 0 rgba(255,255,255,.05)}.d3-back .shade{opacity:var(--lb)}.d3-stage[data-model="p"] .d3-back .plate{left:24%;right:24%;top:16%;bottom:24%}.d3-stage[data-model="p"] .d3-back .plate::before,.d3-stage[data-model="p"] .d3-back .plate::after{width:11%;margin-left:-5.5%}.d3-stage[data-model="p"] .d3-back .port{left:40%;width:20%;bottom:10%;height:4.5%}.d3-side{width:var(--d);height:calc(var(--h) - 2px);left:calc(50% - var(--d) / 2);top:1px;background:linear-gradient(90deg,#2b2b30 0,#17171a 7%,#111114 50%,#0b0b0d 93%,#1d1d21 100%)}.d3-side::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(0,0,0,.55);box-shadow:1px 0 0 rgba(255,255,255,.04)}.d3-side.r{transform:rotateY(90deg) translateZ(calc(var(--w) / 2))}.d3-side.l{transform:rotateY(-90deg) translateZ(calc(var(--w) / 2))}.d3-side.r .shade{opacity:var(--lr)}.d3-side.l .shade{opacity:var(--ll)}.d3-cap{width:calc(var(--w) - 2px);height:var(--d);left:1px;top:calc(50% - var(--d) / 2)}.d3-cap.t{transform:rotateX(90deg) translateZ(calc(var(--h) / 2));background:linear-gradient(180deg,#34343a,#1b1b1f 12%,#17171a 88%,#2a2a2f)}.d3-cap.b{transform:rotateX(-90deg) translateZ(calc(var(--h) / 2));background:linear-gradient(180deg,#0c0c0e,#070708)}.d3-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);margin:0;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:7px 14px 7px 11px;border-radius:999px;font-size:13px;font-weight:500;color:var(--muted);background:color-mix(in srgb,var(--surface) 82%,transparent);border:1px solid var(--line);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);pointer-events:none;transition:opacity .5s ease}.d3-hint .i{width:16px;height:16px;color:var(--violet)}.d3-stage.used .d3-hint{opacity:.55}:root[data-theme="dark"] .d3-stage::before{background:radial-gradient(closest-side,rgba(124,58,237,.3),rgba(37,99,235,.12) 55%,transparent 75%)}:root[data-theme="dark"] .d3-floor{background:radial-gradient(closest-side,rgba(0,0,0,.6),rgba(0,0,0,.2) 60%,transparent)}:root[data-theme="dark"] .d3-side,:root[data-theme="dark"] .d3-back{outline:1px solid rgba(167,139,250,.14);outline-offset:-1px}@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .d3-stage::before{background:radial-gradient(closest-side,rgba(124,58,237,.3),rgba(37,99,235,.12) 55%,transparent 75%)}:root:not([data-theme="light"]) .d3-floor{background:radial-gradient(closest-side,rgba(0,0,0,.6),rgba(0,0,0,.2) 60%,transparent)}:root:not([data-theme="light"]) .d3-side,:root:not([data-theme="light"]) .d3-back{outline:1px solid rgba(167,139,250,.14);outline-offset:-1px}}@media (max-width:860px){.d3-grid{grid-template-columns:1fr}.d3-viz{order:2}}