.walk-avatar-panel {
  position:absolute;right:14px;bottom:72px;z-index:24;
  width:300px;max-width:calc(100% - 28px);padding:10px;
  box-sizing:border-box;border:1px solid #c5d6cb;border-radius:10px;
  background:rgba(255,255,255,.94);color:#284036;
  display:grid;gap:7px;font-size:12px;
}
.walk-avatar-panel[hidden]{display:none!important}
.walk-avatar-row{display:flex;gap:6px}
.walk-avatar-row button,.walk-avatar-row select{
  min-height:34px;min-width:0;padding:5px 8px;border:1px solid #c5d6cb;
  background:#fff;color:#17695c;border-radius:5px;font:inherit;flex:1;
}
.walk-avatar-row select{flex:1.5}
.walk-avatar-row :disabled{opacity:.5;cursor:default}
.walk-avatar-panel small{line-height:1.5}
.avatar-appearance-dialog{width:min(820px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 32px);padding:0;border:1px solid #c7d3c6;border-radius:20px;background:#fafbf7;color:#2d4438;box-shadow:0 24px 90px #15372940;overflow:auto}
.avatar-appearance-dialog::backdrop{background:#152e296b;backdrop-filter:blur(5px)}
.avatar-appearance-dialog form{margin:0}
.avatar-appearance-dialog header,.avatar-appearance-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px}
.avatar-appearance-dialog header{border-bottom:1px solid #dde3d8}
.avatar-appearance-dialog h2{font-size:22px;margin:4px 0 0;letter-spacing:.03em}
.avatar-appearance-dialog small{font-size:11px;color:#63765f}
.avatar-appearance-dialog button,.avatar-appearance-dialog select{font:inherit;color:#2d4438;border:1px solid #c7d3c6;border-radius:9px;background:#fff;min-height:38px;padding:7px 11px;cursor:pointer}
.avatar-appearance-dialog button:focus-visible,.avatar-appearance-dialog select:focus-visible,.avatar-appearance-dialog input:focus-visible{outline:2px solid #5b8267;outline-offset:3px}
.avatar-appearance-dialog header button{background:#2e5743;color:#fff;border-color:#2e5743;min-width:72px}
.avatar-appearance-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}
.avatar-appearance-preview{position:relative;min-height:455px;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#fff 10%,#e5eddf 85%)}
.avatar-appearance-preview canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.avatar-appearance-preview>small{position:absolute;bottom:18px;left:0;right:0;text-align:center;pointer-events:none}
.avatar-appearance-views{position:absolute;left:14px;top:14px;z-index:1;display:flex;gap:6px}
.avatar-appearance-views button{font-size:11px;min-height:30px;padding:4px 10px;background:#ffffffc9}
.avatar-appearance-options{padding:18px 22px}
.avatar-appearance-options p{font-size:12px;line-height:1.7;margin:0 0 16px;color:#657263}
.avatar-appearance-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}
.avatar-appearance-fields>label{display:grid;gap:6px;font-size:12px}
.avatar-appearance-fields select{width:100%;min-width:0;font-size:12px}
.avatar-appearance-colors{grid-column:1/-1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;border-top:1px solid #dde3d8;padding-top:17px}
.avatar-appearance-colors label{display:grid;gap:8px;text-align:center;font-size:11px}
.avatar-appearance-colors input{display:block;width:100%;height:34px;padding:3px;border:1px solid #cad6c5;border-radius:7px;background:#fff;cursor:pointer}
.avatar-appearance-dialog footer{border-top:1px solid #dde3d8;font-size:12px}
.avatar-appearance-dialog footer small{display:block;margin-top:4px}
@media(max-width:600px){
  .avatar-appearance-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:14px}
  .avatar-appearance-dialog header,.avatar-appearance-dialog footer{padding:14px 16px}
  .avatar-appearance-layout{grid-template-columns:minmax(0,1fr)}
  .avatar-appearance-preview{min-height:275px;height:275px}
  .avatar-appearance-options{padding:16px}
  .avatar-appearance-dialog footer{position:sticky;bottom:0;background:#fafbf7}
}
@media(max-width:700px){
  .walk-avatar-panel{right:8px;bottom:64px;width:250px;padding:7px;font-size:11px}
  .walk-avatar-row button,.walk-avatar-row select{min-height:32px;padding:4px}
}