/* The UI stays inside the picture area; it never changes the character anatomy. */
.di-root{position:absolute;inset:0;z-index:8;overflow:hidden;pointer-events:none;color:#ece4d3;font:12px/1.5 system-ui,sans-serif;user-select:none;-webkit-user-select:none;--di-progress:0}
.di-hint{position:absolute;left:50%;bottom:6px;z-index:9;transform:translateX(-50%);width:max-content;max-width:94%;padding:5px 10px;border:1px solid #b0a18838;border-radius:5px;background:#0c0c0be8;font-size:10px;text-align:center;pointer-events:none}
.di-button{min-height:44px;min-width:44px;padding:8px 12px;border:1px solid #b7a98580;border-radius:5px;background:#27251ff2;color:#eee5d4;cursor:pointer;touch-action:manipulation;font:12px/1.4 system-ui,sans-serif}
.di-button:focus-visible,.di-focus-range:focus-visible{outline:2px solid #efd99e;outline-offset:3px}
.di-button:disabled,.di-focus-range:disabled{opacity:.42;cursor:default}
.di-trace-svg{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible;pointer-events:none}
.di-trace-guide{fill:none;stroke:#e9e1c98a;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2 5;filter:drop-shadow(0 0 3px #000)}
.di-trace-done{fill:none;stroke:#f9e0a6;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px #edc97799)}
.di-trace-surface{position:absolute;inset:0;z-index:3;pointer-events:auto;touch-action:none;cursor:crosshair}
.di-trace-progress{position:absolute;right:10px;bottom:39px;z-index:4;padding:4px 8px;border:1px solid #bba97d55;border-radius:4px;background:#0a0a09d9;color:#e4d5b3;font-size:10px;pointer-events:none}
.di-trace-assist{position:absolute;left:50%;bottom:38px;z-index:6;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;width:min(94%,320px);transform:translateX(-50%);padding:6px;border-radius:7px;background:#0d0d0bf2;pointer-events:auto}
.di-trace-assist[hidden]{display:none}
.di-trace-assist .di-button{min-height:48px;padding:8px 5px}
.di-trace-assist .di-button[data-done=true]{border-color:#e5d3a2;background:#665a3b88;color:#e9dcba}
.di-root.has-assist .di-trace-progress{bottom:105px}
.di-focus-window{position:absolute;z-index:2;border:1px solid #b8ad9280;border-radius:50%;overflow:hidden;box-shadow:0 0 0 5px #080a0866,inset 0 0 18px #080a0877;pointer-events:none}
.di-focus-image{position:absolute;inset:0;background-repeat:no-repeat;transform:translateZ(0);will-change:filter;pointer-events:none}
.di-focus-window:after{content:"";position:absolute;inset:0;border-radius:50%;background:linear-gradient(140deg,#f3e4c513,transparent 45%,#1525211f);box-shadow:inset 0 0 18px #080a0877;pointer-events:none}
.di-root.is-focused .di-focus-window{border-color:#f1dda3;box-shadow:0 0 0 4px #d8c1802b,0 0 14px #d5bf7950}
.di-focus-panel{position:absolute;left:50%;bottom:38px;z-index:6;width:min(94%,350px);transform:translateX(-50%);padding:9px 12px 6px;border:1px solid #b9a67c66;border-radius:7px;background:linear-gradient(180deg,#191b16ee,#0b100deF);box-shadow:0 4px 15px #0006;pointer-events:auto}
.di-focus-heading{display:block;font-size:11px;letter-spacing:2px;color:#ddcfb2}
.di-focus-status{display:block;font-size:10px;line-height:1.7;color:#bfc6b7;min-height:17px}
.di-focus-row{display:flex;align-items:center;gap:10px}
.di-adjust{flex:0 0 44px;height:44px;padding:0;font-size:22px}
.di-focus-range{width:100%;min-width:0;flex:1;height:48px;appearance:none;-webkit-appearance:none;background:transparent;cursor:ew-resize;touch-action:none;accent-color:#d3bf8c}
.di-focus-range::-webkit-slider-runnable-track{height:7px;border:1px solid #9e8e6877;border-radius:10px;background:linear-gradient(90deg,#3f4d47,#788070,#3f4d47)}
.di-focus-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:28px;height:32px;margin-top:-13px;border:1px solid #e0d1ad;border-radius:5px;background:linear-gradient(90deg,#746b55,#c3b38f,#746b55);box-shadow:0 2px 5px #0007}
.di-focus-range::-moz-range-track{height:7px;border:1px solid #9e8e6877;border-radius:10px;background:#657265}
.di-focus-range::-moz-range-thumb{width:27px;height:31px;border:1px solid #e0d1ad;border-radius:5px;background:#c3b38f}
.di-root.is-error .di-focus-panel{border-color:#c79b79}
.di-root.is-disabled .di-trace-surface,.di-root.is-paused .di-trace-surface,.di-root.is-done .di-trace-surface{pointer-events:none}
.di-root.is-paused *{animation-play-state:paused!important}
.di-root.is-done .di-focus-panel,.di-root.is-done .di-trace-assist,.di-root.is-done .di-trace-progress{display:none}
.di-root.is-reduced *{animation:none!important;transition:none!important}
@media(max-width:760px){.di-hint{font-size:9px;line-height:1.5;padding:4px 8px}.di-focus-panel{padding:7px 9px 4px;bottom:38px}.di-focus-row{gap:7px}.di-trace-assist{width:min(94%,320px)}}