#anatomy { right: 12px; top: 12px; width: 560px; }
.anatomy-subject { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
.anatomy-subject strong { display: block; color: #e4eee9; font-size: 14px; }
.anatomy-subject span:not(.anatomy-live) { display: block; color: #91a7b5; font-size: 11px; margin-top: 4px; }
.anatomy-live { border: 1px solid #38796d; background: #153a33; color: #a3edda; border-radius: 20px; padding: 5px 9px; font-size: 10px; white-space: nowrap; }
.anatomy-live::before { content: ''; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: currentColor; margin-right: 5px; }
.anatomy-live.stopped { border-color: #475762; background: #25333c; color: #b3c1c9; }
.anatomy-tabs { display: flex; gap: 4px; padding: 4px; border: 1px solid #304552; background: #0c161e; border-radius: 10px; margin-bottom: 10px; overflow-x: auto; }
.anatomy-tabs button { flex: 1; border: 0; background: transparent; border-radius: 6px; color: #9caeba; font: inherit; font-size: 10px; padding: 9px 7px; white-space: nowrap; cursor: pointer; }
.anatomy-tabs button[aria-selected="true"] { color: #b7f4e1; background: #244338; }
.anatomy-stage { height: 280px; position: relative; border: 1px solid #2c424e; border-radius: 12px; overflow: hidden; background: radial-gradient(ellipse at 50% 65%, #203844, #0b1720); }
#an-canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; }
#an-canvas:active { cursor: grabbing; }
#an-labels { position: absolute; inset: 0; pointer-events: none; }
#an-labels[hidden] { display: none; }
#an-labels button { position: absolute; left: 0; top: 0; pointer-events: auto; color: #cfdfdf; border: 1px solid #536b75; background: #14252de8; border-radius: 5px; padding: 3px 5px; font: inherit; font-size: 9px; cursor: pointer; white-space: nowrap; }
#an-labels button[aria-pressed="true"] { border-color: #a1ddc5; color: #ccffe9; background: #264b40; }
.anatomy-drag-hint { position: absolute; left: 12px; bottom: 9px; color: #91a6b2; font-size: 9px; pointer-events: none; }
.anatomy-hint { margin: 8px 0 10px; font-size: 10px; line-height: 1.5; color: #98b5be; }
.anatomy-options { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: 10px; color: #b1c2ca; padding: 4px 0 10px; }
.anatomy-options label { display: flex; align-items: center; gap: 5px; cursor: pointer; }
.anatomy-options input { margin: 0; accent-color: #80dac3; }
.anatomy-camera { display: flex; align-items: center; gap: 5px; margin-bottom: 12px; }
.anatomy-camera span { font-size: 10px; color: #8ba0af; margin-right: 4px; }
.anatomy-camera button { color: #a9c2ca; border: 1px solid #334f5b; background: #1b2d37; border-radius: 6px; font: inherit; font-size: 10px; padding: 5px 10px; cursor: pointer; }
.anatomy-camera button:last-child { margin-left: auto; }
.anatomy-parts { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; max-height: 104px; overflow: auto; margin-bottom: 10px; scrollbar-width: thin; }
.anatomy-parts button { display: flex; align-items: center; gap: 7px; color: #b0c2ca; background: #15252f; border: 1px solid #2a404d; border-radius: 6px; padding: 7px 8px; text-align: left; font: inherit; font-size: 10px; cursor: pointer; }
.anatomy-parts button i { width: 7px; height: 7px; border-radius: 3px; flex: none; }
.anatomy-parts button[aria-pressed="true"] { border-color: #75998b; color: #dcf3e8; background: #223d35; }
.anatomy-detail { border-left: 2px solid #89cfb9; background: #172b32; border-radius: 0 8px 8px 0; padding: 9px 12px; min-height: 58px; }
.anatomy-detail strong { color: #dcebe6; font-size: 11px; }
.anatomy-detail p { margin: 4px 0 0; color: #a5b9c1; font-size: 10px; line-height: 1.6; }
.anatomy-note { margin: 10px 0 0; color: #7f96a4; font-size: 9px; line-height: 1.6; }
.anatomy-note a { color: #9dc9c7; }
@media (max-width: 700px) { .anatomy-stage { height: 230px; } .anatomy-tabs button { padding: 9px 6px; } }
