/* 3D avatar editor (avatar3d.html). Built on css/styles.css. */
.a3d{display:grid;grid-template-columns:minmax(300px,440px) 1fr;gap:22px;align-items:start}
.a3d-stage{position:sticky;top:12px;padding:14px}
.a3d-view{position:relative;border-radius:18px;overflow:hidden;background:linear-gradient(#bfe6ff 0%,#e8f6ff 62%,#9ad18a 62%,#7cc46a 100%);aspect-ratio:1/1.12;touch-action:none;cursor:grab}
.a3d-view:active{cursor:grabbing}
.a3d-view canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.a3d-hint{position:absolute;left:0;right:0;bottom:8px;text-align:center;font-size:.8rem;font-weight:700;color:#35508a;pointer-events:none;text-shadow:0 1px 0 #fff}
.a3d-anims{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 4px;justify-content:center}
.a3d-anims button{border:2px solid #c9cdf5;background:#fff;border-radius:999px;padding:6px 14px;font-weight:700;cursor:pointer;min-height:40px;font:inherit;font-weight:700}
.a3d-anims button[aria-pressed="true"]{background:#5b5fe8;color:#fff;border-color:#5b5fe8}
.a3d-coins{display:flex;justify-content:space-between;align-items:center;margin:8px 0;font-weight:700}
.a3d-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.a3d-tabs button{border:2px solid #c9cdf5;background:#fff;border-radius:12px;padding:8px 14px;font:inherit;font-weight:800;cursor:pointer;min-height:44px}
.a3d-tabs button[aria-selected="true"]{background:#1d2147;color:#fff;border-color:#1d2147}
.a3d-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.a3d-item{position:relative;border:3px solid #cfd3f7;background:#fff;border-radius:14px;padding:6px 6px 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;font:inherit;color:inherit;min-height:132px}
.a3d-item canvas{width:84px;height:84px;border-radius:10px;background:linear-gradient(#e8f2ff,#f6fbff)}
.a3d-item .nm{font-weight:800;font-size:.85rem;text-align:center;line-height:1.15}
.a3d-item:hover:not([disabled]){border-color:#5b5fe8}
.a3d-item[aria-pressed="true"]{border-color:#1fa563;background:#e6f8ee}
.a3d-item[disabled]{cursor:not-allowed}
.a3d-item[disabled] canvas{filter:grayscale(.85) brightness(.85);opacity:.7}
.a3d-lock{position:absolute;top:6px;right:6px;background:#1d2147;color:#fff;border-radius:999px;font-size:.72rem;font-weight:800;padding:2px 8px}
.a3d-cost{font-size:.78rem;font-weight:800;color:#7a5200}
.a3d-swatches{display:flex;gap:8px;flex-wrap:wrap}
.a3d-msg{min-height:1.4em;font-weight:700}
@media (max-width:820px){.a3d{grid-template-columns:1fr}.a3d-stage{position:static}.a3d-view{aspect-ratio:1/1;max-height:60vh;margin:0 auto}}

/* ---------- phones: preview stays pinned while you pick items; Save stays reachable; vertical swipes still scroll ---------- */
.a3d-view{touch-action:pan-y}
.a3d-tabs button,.a3d-anims button{touch-action:manipulation}
@media (max-width:820px){
  .a3d{display:flex;flex-direction:column;gap:12px}
  .a3d-stage{display:contents}
  .a3d-view{order:0;position:sticky;top:68px;z-index:20;width:100%;aspect-ratio:auto;height:min(36vh,300px);max-height:none;border:3px solid #fff;box-shadow:0 8px 20px rgba(29,33,71,.25)}
  .a3d-anims{order:1;margin:0}
  .a3d-coins{order:2;margin:0}
  .a3d-name{order:3;margin:0}
  .a3d-items{order:4;padding:16px}
  .a3d-actions{order:5;position:sticky;bottom:0;z-index:20;background:rgba(247,248,255,.96);padding:8px 0 max(8px,env(safe-area-inset-bottom));border-top:2px solid #e2e5f5;margin:0 -16px;padding-left:16px;padding-right:16px}
  .a3d-actions .btn-row{margin-top:0!important;flex-wrap:nowrap;gap:8px}
  .a3d-actions .btn{flex:1 1 auto;padding:10px 8px;min-height:46px;font-size:.92rem}
  .a3d-actions .btn.sun{flex:1.4 1 auto}
  .a3d-msg{min-height:1.2em;text-align:center;font-size:.9rem}
  .a3d-stage>.fineprint{order:6;text-align:center}
  .a3d-grid{grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:8px}
  .a3d-tabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;margin:0 -4px 10px;padding:0 4px 4px}
  .a3d-tabs button{flex:none}
}
@media (max-width:820px) and (orientation:landscape){.a3d-view{height:min(60vh,240px)}}
@media (max-width:820px){.a3d,.a3d>*{min-width:0;max-width:100%}.a3d-tabs{max-width:100%;width:auto}}

/* ---------- Gold items, jerseys, buddy egg ---------- */
.a3d-gold{border-color:#e0b020;background:linear-gradient(#fffbea,#fff2b8)}
.a3d-gold canvas{background:linear-gradient(#fff6cf,#ffe58a)}
.a3d-gold[aria-pressed="true"]{border-color:#1fa563;background:linear-gradient(#f2ffe9,#fff2b8)}
.a3d-goldtag{position:absolute;top:6px;left:6px;background:linear-gradient(#ffe066,#e8a800);color:#4a3000;border-radius:999px;font-size:.66rem;font-weight:900;padding:2px 7px;letter-spacing:.04em;box-shadow:0 1px 0 #b8860b}
.a3d-gold .a3d-cost{color:#8a5a00}
.a3d-goldnote{margin:0 0 10px;padding:8px 12px;border-radius:12px;background:#fff3b8;border:2px solid #e0b020;font-weight:700;color:#4a3000}
.a3d-eggnote{text-align:center;margin:-4px 0 10px}
#egg .bd-card{max-width:none}
/* keep the GOLD tag and the 🔒 120 badge from overlapping on narrow cards */
.a3d-gold .a3d-goldtag{top:4px;left:4px;font-size:.58rem;padding:2px 6px}
.a3d-gold .a3d-lock{top:4px;right:4px;font-size:.62rem;padding:2px 6px}
