.leg-app #viewport{height:clamp(600px,84vh,980px)}
.structure-label.leg-artery{border-left:3px solid #c8453b}
.structure-label.leg-vein{border-left:3px solid #4c72b4}
.structure-label.leg-nerve{border-left:3px solid #e3b330}
.structure-label.leg-ligament{border-left:3px solid #c9b894}
.structure-label.selected{border-left-color:#596b60}
@media(max-width:900px){.leg-app #viewport{height:620px}}
@media(max-width:650px){.leg-app #viewport{height:min(640px,82vh);margin-bottom:60px}}
.level-nav{position:absolute;left:16px;top:50%;transform:translateY(-52%);width:48px;height:min(60%,520px);z-index:6;touch-action:none;cursor:ns-resize;outline:none;user-select:none;-webkit-user-select:none}
.level-nav svg{display:block;width:100%;height:100%;overflow:visible}
.level-body{fill:#eadfd3;stroke:#b8a593;stroke-width:1.2;vector-effect:non-scaling-stroke}
.level-artery{fill:none;stroke:#c8453b;stroke-width:1.6;vector-effect:non-scaling-stroke;opacity:.85}
.level-joint{fill:none;stroke:#b8a593;stroke-width:1;vector-effect:non-scaling-stroke;opacity:.7}
.level-band{position:absolute;left:-6px;right:-6px;border:1.5px solid #3f7356;background:#3f73561f;border-radius:5px;pointer-events:none}
.level-line{position:absolute;left:-10px;right:-10px;height:2px;margin-top:-1px;background:#3f7356;pointer-events:none}
.level-line::after{content:'';position:absolute;right:-7px;top:-4px;border:5px solid transparent;border-left:7px solid #3f7356}
.level-name{position:absolute;top:100%;left:50%;transform:translateX(-50%);margin-top:10px;white-space:nowrap;font-size:11px;font-weight:600;color:#3f7356;background:#fffdf9ee;border:1px solid #cddbcf;border-radius:5px;padding:2px 7px;pointer-events:none}
.level-hint{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);margin-bottom:8px;white-space:nowrap;font-size:10px;color:#8a7768;pointer-events:none}
.level-nav:focus-visible .level-body{stroke:#3f7356;stroke-width:2}
@media(max-width:650px){.level-nav{left:10px;width:22px;height:min(58%,440px)}.level-band{left:-5px;right:-5px}.level-name{font-size:10px;padding:2px 5px;left:0;transform:none}.level-hint{left:0;transform:none}}
.leg-side{display:flex;align-items:center;gap:12px;margin:10px 22px 2px;font-size:13px;color:var(--muted,#7a6a5d)}
.side-toggle{display:inline-flex;border:1px solid #d8c9b8;border-radius:9px;overflow:hidden;background:#fffdfa}
.side-toggle button{border:0;background:transparent;padding:7px 14px;font-size:13px;color:#5c483c;cursor:pointer}
.side-toggle button+button{border-left:1px solid #d8c9b8}
.side-toggle button[aria-pressed=true]{background:#596b60;color:#fff}
.leg-extent{fill:none;stroke:#0f9f76;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.leg-app .structure-label.selected{background:#0f9f76;border-color:#0f9f76;color:#fff;box-shadow:0 0 0 3px #0f9f7633}
.leg-app .anatomy-target.selected{fill:#0f9f76}
@media(max-width:650px){.leg-side{margin:8px 12px 0;font-size:12px}.side-toggle button{padding:6px 11px;font-size:12px}}
.leg-app .label-lines polyline.selected{stroke:#0f9f76;stroke-width:2.6}
.leg-app .label-lines polyline{stroke:#87664d;stroke-width:2.2;opacity:1}
.leg-app .label-lines polyline.selected{stroke:#0f9f76;stroke-width:3}
.leg-app .anatomy-target{stroke-width:2}
.level-dim{fill:#f7f2eb;opacity:.62}
.level-nav{background:rgba(255,253,249,.88);border-radius:10px;box-shadow:0 0 0 7px rgba(255,253,249,.88)}
.level-line::after{top:-6px!important;border:7px solid transparent!important}
.level-nav[data-side=R] .level-line::after{left:-2px;right:auto;border-left:11px solid #3f7356!important;border-right-width:0!important}
.level-nav[data-side=L] .level-line::after{right:-2px;left:auto;border-right:11px solid #3f7356!important;border-left-width:0!important}
@media(max-width:650px){.level-dim{display:none}}
