/* CLAWD-WARDROBE-20261020 */
.pet { width: 60px; height: 47px; }
.pet .pet-svg { width: 60px; height: 47px; }
.pet-dress-button { position: absolute; right: 93px; bottom: 100%; z-index: 5; width: 28px; height: 28px; padding: 5px;
  margin-bottom: 3px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px;
  color: var(--dim); background: var(--sheet, #f7f4f8); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pet-dress-button svg { width: 17px; height: 17px; }
.pet-dress-button:focus-visible { outline: 2px solid var(--text); outline-offset: 2px; }
.pet[data-dress-mode="manual"] .pet-legacy-accessories { display: none; }
.pet[data-dress-mode="manual"] .pet-z { display: none; }
.pet[data-dress-mode="manual"].nap .pet-z { display: block; }
.cw-preferences { padding: 16px; }
.cw-preferences h3 { margin: 0 0 7px; font-size: 16px; color: var(--text); }
.cw-preferences p { margin: 6px 0 14px; color: var(--dim); font-size: 12px; line-height: 1.6; }
.cw-preferences + .cw-preferences { border-top: 1px solid var(--line); }
.cw-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.cw-card { appearance: none; -webkit-appearance: none; min-width: 0; padding: 10px 3px 8px; border-radius: 12px;
  border: 1px solid var(--line); background: transparent; color: var(--text); font: inherit; font-size: 12px; cursor: pointer; }
.cw-card[aria-pressed="true"] { border-color: var(--accent, #b78771); background: color-mix(in srgb, var(--text) 7%, transparent); box-shadow: inset 0 0 0 1px var(--accent, #b78771); }
.cw-card:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
.cw-card svg { display: block; width: 76px; height: 60px; max-width: 100%; margin: 0 auto 8px; }
.cw-preview-button { width: 100%; margin-top: 14px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px;
  background: transparent; color: var(--text); font: inherit; font-size: 13px; cursor: pointer; }
@media (prefers-reduced-motion: reduce) {
  .pet .eyes, .pet .pet-flower, .pet .arm-r, .pet .pet-svg, .pet .pet-walk { animation: none !important; }
}

/* Motion Lab proportions, adapted to Vael's existing input and opening frames. */
.pet[data-motion-action] .pet-svg,
.pet[data-motion-action] .pet-walk,
.pet[data-motion-action] .arm-r { animation: none; }
.pet[data-motion-action] .pet-walk { will-change: transform; }
.pet[data-motion-action="sleep"] .pet-z { display:block; }
.cw-motion-eyes { animation:none; }
.cw-motion-model .happy,.cw-motion-model .sleepy { display:none; }
.cw-motion-model.joy .eyes,.cw-motion-model.nap .eyes { display:none; }
.cw-motion-model.joy .happy,.cw-motion-model.nap .sleepy { display:inline; }
.cw-motion-stage { height:174px; position:relative; display:grid; place-items:end center; margin:12px 0 10px;
  border-radius:15px; overflow:visible; background:color-mix(in srgb,var(--text) 3%,transparent); }
.cw-motion-stage::after { content:""; position:absolute; bottom:16px; left:25%; right:25%; height:1px; background:var(--line); }
.cw-motion-model { border:0; padding:0; background:none; width:154px; height:140px; margin:0 0 17px; color:inherit;
  cursor:pointer; position:relative; z-index:1; -webkit-tap-highlight-color:transparent; }
.cw-motion-model:focus-visible { outline:2px solid var(--accent); outline-offset:5px; border-radius:10px; }
.cw-motion-lift, .cw-motion-lift svg { display:block; width:154px; height:140px; overflow:visible; transform-origin:50% 100%; }
.cw-motion-actions { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 18px; }
.cw-motion-actions button { flex:1 0 27%; min-height:33px; padding:7px 8px; border:1px solid var(--line); border-radius:10px;
  color:var(--dim); background:transparent; font:inherit; font-size:12px; cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:background .18s,color .18s,transform .24s cubic-bezier(.2,1.6,.5,1); }
.cw-motion-actions button[aria-pressed="true"] { color:var(--text); background:color-mix(in srgb,var(--text) 7%,transparent); }
.cw-motion-actions button:active { transform:scale(.95); }
.cw-card { transition:background .2s,border-color .2s,transform .28s cubic-bezier(.2,1.7,.5,1); }
.cw-card:active { transform:scale(.96); }
.cw-card .cw-motion-preview-art { width:83px; height:76px; margin-top:-4px; margin-bottom:0; }
.cw-thought { position:absolute; right:12%; top:14%; display:flex; gap:3px; padding:6px 8px; border:1px solid var(--line);
  border-radius:8px; background:var(--sheet,#faf9f5); pointer-events:none; box-shadow:0 2px 5px #00000010; }
.pet .cw-thought { right:4px; top:-17px; }
.cw-thought i { width:3px; height:3px; background:var(--dim); animation:cw-thinking 1s ease-in-out infinite; }
.cw-thought i:nth-child(2) { animation-delay:.15s; }.cw-thought i:nth-child(3) { animation-delay:.3s; }
@keyframes cw-thinking { 0%,70%,100%{opacity:.35;transform:translateY(0)}35%{opacity:1;transform:translateY(-2px)} }
@media(prefers-reduced-motion:reduce){.cw-thought i{animation:none}.cw-card,.cw-motion-actions button{transition:none}.cw-card:active,.cw-motion-actions button:active{transform:none}}
