.community-links { gap: 0 26px; }
.frame .community-links button {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; padding: 0; border: 0; background: transparent;
  color: #29251e; font: 500 13px/1 system-ui, sans-serif; cursor: pointer;
}
.frame .community-links a { gap: 8px; }
.frame .community-links button:hover:not(:disabled), .frame .community-links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.frame .community-links .community-x { cursor: default; color: #29251e; min-width: 24px; justify-content: center; }
.community-x svg { display: block; }
.community-links :focus-visible { outline: 1px solid #29251e; outline-offset: 5px; }

.avatar-studio {
  box-sizing: border-box; width: min(1000px, calc(100vw - 48px));
  max-width: none; max-height: calc(100svh - 48px); margin: auto; padding: 24px 28px 26px;
  overflow: auto; overscroll-behavior: contain; border: 1px solid #29251e25; border-radius: 2px;
  background: #f6f1e8; color: #29251e; box-shadow: 0 28px 100px #17140f40;
  font: 400 13px/1.5 system-ui, sans-serif;
}
.avatar-studio::backdrop { background: #29251e9c; backdrop-filter: blur(7px); }
.avatar-studio *, .avatar-studio *::before, .avatar-studio *::after { box-sizing: border-box; }
.avatar-studio button, .avatar-studio input, .avatar-studio a { font: inherit; color: inherit; }
.avatar-studio button { cursor: pointer; }
.avatar-studio button:disabled { cursor: wait; opacity: .55; }
.avatar-studio :focus-visible { outline: 2px solid #5e7169; outline-offset: 4px; }
.avatar-studio [hidden] { display: none !important; }
.studio-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 22px; }
.studio-header p { font-size: 11px; letter-spacing: .04em; margin: 0; }
.studio-header p span { color: #817a70; font-size: 9px; margin-left: 8px; letter-spacing: .1em; }
.studio-close { display: grid; place-items: center; min-width: 36px; min-height: 36px; padding: 0; border: none; background: none; }
.studio-close svg { fill: none; stroke: currentColor; stroke-width: 1.2; }
.studio-layout { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(250px, .85fr); gap: 32px; align-items: start; }
.studio-canvas-wrap { position: relative; border: 1px solid #29251e19; background: #eae4d9; aspect-ratio: 1; }
#community-avatar { display: block; width: 100%; height: 100%; touch-action: none; cursor: grab; }
#community-avatar:active { cursor: grabbing; }
#community-avatar[data-preset]:not([data-preset=""]) { cursor: default; }
.studio-loading { position: absolute; inset: 0; display: grid; place-items: center; padding: 28px; background: #f1ebe1; text-align: center; }
.studio-preview-note { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; font-size: 10px; color: #726d64; }
.studio-preview-note button { border: 0; padding: 5px 0; background: none; font-size: 10px; }
.studio-preview-note button[aria-pressed="true"] { text-decoration: underline; text-underline-offset: 4px; color: #29251e; }
.studio-canvas-wrap.is-round { border-radius: 50%; overflow: hidden; }
.studio-eyebrow { font-size: 8px; letter-spacing: .12em; margin: 0 0 13px; }
.avatar-studio #avatar-studio-title { margin: 0 0 15px; font: 400 clamp(35px, 4.3vw, 61px)/1.05 'RI Brand', Impact, sans-serif; letter-spacing: -.015em; text-transform: none; color: #29251e; white-space: normal; text-align: left; }
.studio-intro { margin: 0 0 20px; color: #70695f; line-height: 1.6; font-size: 12px; }
.studio-upload { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 44px; padding: 10px 13px; background: transparent; border: 1px solid #29251e55; border-radius: 1px; text-align: left; }
.studio-upload:hover { background: #eae3d6; }
.studio-random { display: block; width: 100%; min-height: 44px; padding: 10px 13px; border: 1px solid #29251e55; border-radius: 1px; background: #eae3d6; text-align: left; margin-bottom: 9px; }
.studio-random:hover { background: #e1d7c6; }
.studio-local { margin: 7px 0 19px; color: #888176; font-size: 9px; }
.studio-layer { display: flex; gap: 20px; border-bottom: 1px solid #29251e24; margin: 0 0 18px; }
.studio-layer button { border: 0; border-bottom: 1px solid transparent; border-radius: 0; margin-bottom: -1px; padding: 0 0 9px; background: none; font-size: 11px; color: #888176; }
.studio-layer button[aria-pressed="true"] { border-bottom-color: #29251e; color: #29251e; }
.studio-range { display: block; margin: 0 0 13px; }
.studio-range > span { display: flex; justify-content: space-between; font-size: 10px; margin: 0 0 5px; }
.studio-range output { color: #888176; font-variant-numeric: tabular-nums; }
.studio-range input { display: block; width: 100%; height: 13px; margin: 0; appearance: none; -webkit-appearance: none; background: transparent; accent-color: #29251e; cursor: pointer; }
.studio-range input::-webkit-slider-runnable-track { height: 1px; background: #a79f91; }
.studio-range input::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; margin-top: -5px; height: 11px; width: 11px; background: #29251e; border-radius: 50%; }
.studio-range input::-moz-range-track { height: 1px; background: #a79f91; }
.studio-range input::-moz-range-thumb { height: 11px; width: 11px; background: #29251e; border: 0; border-radius: 50%; }
.studio-adjust-note { font-size: 10px; color: #888176; min-height: 64px; margin-top: 12px; }
.studio-reset-row { display: flex; justify-content: space-between; gap: 12px; margin: 15px 0 20px; }
.studio-reset-row button { padding: 4px 0; border: 0; background: none; font-size: 10px; text-decoration: underline; text-underline-offset: 3px; color: #70695f; }
.studio-download { width: 100%; min-height: 45px; display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; border: 1px solid #29251e; border-radius: 1px; color: #f6f1e8 !important; background: #29251e; }
.studio-download:hover { background: #423c32; }
.studio-download-note { display: flex; justify-content: space-between; gap: 10px; margin-top: 9px; font-size: 9px; color: #888176; }
.studio-download-note a { text-decoration: underline; text-underline-offset: 3px; }
.studio-status { min-height: 15px; margin: 9px 0 0; font-size: 10px; color: #70695f; }
@media (max-width: 640px) {
  .frame .community-links button { font-size: 11px; min-height: 34px; }
  .community-links { gap: 0 22px; }
  .avatar-studio { width: 100%; height: 100svh; max-height: 100svh; padding: 17px 22px 30px; border: 0; border-radius: 0; }
  .studio-header { margin-bottom: 18px; }
  .studio-header p span { font-size: 8px; }
  .studio-layout { grid-template-columns: 1fr; gap: 24px; }
  .studio-preview { max-width: 370px; width: 100%; margin: 0 auto; }
  .avatar-studio #avatar-studio-title { font-size: 42px; }
  .studio-range input { height: 22px; }
  .studio-preview-note button, .studio-reset-row button, .studio-layer button { min-height: 36px; }
}