.method-3d{grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:48px;margin-top:44px;align-items:start}.cone-column{min-width:0}.cone-stage{height:445px;position:relative;isolation:isolate}.cone-canvas{position:absolute;inset:18px 0 24px;touch-action:pan-y}.cone-canvas canvas{display:block;width:100%;height:100%}.cone-stage:after{content:'';position:absolute;bottom:10px;left:33%;width:34%;height:15px;border-radius:50%;background:#294e6315;filter:blur(9px);z-index:-1}.cone-direction,.cone-precise{position:absolute;left:0;right:0;text-align:center;font-size:12px;letter-spacing:.17em;color:#59717e;pointer-events:none}.cone-direction{top:0}.cone-precise{bottom:0}.cone-hint{text-align:center;font-size:14px;margin:18px 0}.cone-controls{display:grid;grid-template-columns:1fr 1fr;gap:8px}.cone-step{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 13px;background:transparent;border:1px solid #b7c9d1;border-radius:5px;color:#405f70;text-align:left;font-size:13px;font-weight:600;letter-spacing:.025em;transition:background .3s,color .3s,border-color .3s}.cone-step span{font-weight:400;color:#617c8c}.cone-step[aria-pressed=true]{background:#294e63;color:#fff;border-color:#294e63}.cone-step[aria-pressed=true] span{color:#d7e4ea}.method-3d .panel-host{min-height:660px;opacity:1;transform:translateY(0);transition:opacity .14s ease,transform .2s ease}.method-3d .panel-host.changing{opacity:0;transform:translateY(5px)}.method-3d .detail-panel{animation:none;padding:28px}.method-3d .questions li{font-size:16px;line-height:1.55;padding-block:11px}.method-3d .tools{font-size:14px}.method-3d .tools strong{font-size:14px}.no-webgl .cone-stage{height:100px}.no-webgl .cone-stage:after{display:none}.no-webgl .cone-direction{top:18px}.no-webgl .cone-precise{bottom:18px}
@media(max-width:1000px) and (min-width:901px){.method-3d{grid-template-columns:1fr 1fr;gap:24px}.cone-step{font-size:12px;padding:9px}.cone-stage{height:410px}}
@media(max-width:900px){.method-3d{display:grid;grid-template-columns:1fr;margin-top:30px;gap:27px}.cone-column{width:100%;max-width:560px;margin:auto}.cone-stage{height:400px}.method-3d .panel-host{min-height:0}.method-3d .detail-panel{padding:24px}.cone-step{font-size:14px}.cone-hint{font-size:14px}}
@media(max-width:380px){.cone-stage{height:355px}.cone-step{font-size:12px;padding:10px 8px;gap:6px}}
@media(prefers-reduced-motion:reduce){.method-3d *{transition:none!important;animation:none!important}}