/* Вкладка «Питомец» (pets.js) */
.sk-grid.sk-grid-pet { display: block; }
.pet-wrap { display: flex; flex-direction: column; gap: 14px; transition: opacity .15s; }
.pet-wrap.busy { opacity: .65; pointer-events: none; }

.pet-pic { display: block; width: 96px; height: 96px; background-repeat: no-repeat; flex: 0 0 auto; }
.pet-egg { background: #6b7280; -webkit-mask: url(/skins/img/pet_egg.svg) center / 58% no-repeat; mask: url(/skins/img/pet_egg.svg) center / 58% no-repeat; }

.pet-hero { display: flex; align-items: center; gap: 28px; padding: 18px 28px; border-radius: 16px;
  background: radial-gradient(60% 120% at 12% 60%, rgba(var(--p-rgb), .20), transparent 70%), var(--sk2-panel, #16151c);
  border: 1px solid var(--sk2-line, rgba(255,255,255,.08)); }
.pet-stage { position: relative; flex: 0 0 220px; height: 220px; display: flex; align-items: center; justify-content: center; }
.pet-pic-big { width: 220px; height: 220px; position: relative; z-index: 1; animation: petIdle 3.2s ease-in-out infinite; transform-origin: 50% 90%; }
.pet-floor { position: absolute; left: 50%; bottom: 14px; width: 150px; height: 26px; transform: translateX(-50%); border-radius: 50%;
  background: radial-gradient(closest-side, rgba(var(--p-rgb), .45), transparent); filter: blur(2px); }
@keyframes petIdle { 0%, 100% { transform: translateY(0) rotate(0); } 30% { transform: translateY(-4px) rotate(-1.5deg); } 60% { transform: translateY(0) rotate(1deg); } }
@media (prefers-reduced-motion: reduce) { .pet-pic-big { animation: none; } }

.pet-hero-i { flex: 1; min-width: 0; }
.pet-hero-k { font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--sk2-mut, #9ca0ab); font-weight: 700; }
.pet-hero-n { font-size: 1.6rem; font-weight: 800; color: #fff; margin: 2px 0 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pet-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.pet-tags span { padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 700; color: #e9d5ff;
  background: rgba(var(--p-rgb), .18); border: 1px solid rgba(var(--p-rgb), .35); }
.pet-hero-d { font-size: .85rem; color: #c9ccd4; line-height: 1.5; max-width: 560px; }
.pet-hero-d b { color: rgb(var(--p-rgb)); filter: brightness(1.5); }
.pet-lbl { display: block; margin: 12px 0 6px; font-size: .75rem; color: var(--sk2-mut, #9ca0ab); font-weight: 700; }
.pet-name-row { display: flex; gap: 8px; max-width: 420px; }
.pet-name-row input { flex: 1; min-width: 0; padding: 10px 12px; border-radius: 10px; color: #fff; font-size: .9rem;
  background: rgba(0,0,0,.35); border: 1px solid var(--sk2-line, rgba(255,255,255,.1)); outline: none; }
.pet-name-row input:focus { border-color: rgba(var(--p-rgb), .6); }
.pet-name-row button { padding: 10px 18px; border-radius: 10px; border: 0; background: var(--p); color: #fff; font-weight: 700; cursor: pointer; }
.pet-name-row button:hover { filter: brightness(1.12); }
.pet-name-row button:disabled { opacity: .5; cursor: default; filter: none; }
.pet-msg { margin-top: 8px; font-size: .8rem; color: #4ade80; }
.pet-msg.bad { color: #f87171; }

.pet-sec { display: flex; align-items: center; gap: 8px; margin-top: 4px; padding: 0 4px; color: #fff; font-weight: 800; font-size: .95rem; }
.pet-sec i { color: rgb(var(--p-rgb)); filter: brightness(1.4); }
.pet-sec small { font-size: .72rem; font-weight: 700; color: var(--sk2-mut, #9ca0ab); background: rgba(255,255,255,.06); padding: 1px 7px; border-radius: 999px; }
.pet-grid { display: grid; gap: 12px; }
.pet-grid-breeds { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }
.pet-grid-colors { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 10px; }
.pet-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 10px 10px 14px;
  border-radius: 14px; cursor: pointer; text-align: center; color: #fff; font: inherit;
  background: var(--sk2-card, #1b1a22); border: 1px solid var(--sk2-line, rgba(255,255,255,.08)); transition: border-color .15s, transform .15s, background .15s; }
.pet-card:hover { border-color: rgba(var(--p-rgb), .45); transform: translateY(-2px); }
.pet-card:hover .pet-pic { transform: scale(1.06); }
.pet-card .pet-pic { width: 118px; height: 118px; transition: transform .2s; }
.pet-card.on { border-color: rgba(var(--p-rgb), .8); background: radial-gradient(90% 70% at 50% 30%, rgba(var(--p-rgb), .22), transparent 72%), var(--sk2-card, #1b1a22); }
.pet-card b { font-size: .88rem; font-weight: 800; }
.pet-card small { font-size: .72rem; color: var(--sk2-mut, #9ca0ab); line-height: 1.3; }
.pet-card-sm { padding: 6px 8px 12px; }
.pet-card-sm .pet-pic { width: 100px; height: 100px; }
.pet-card-sm b { font-size: .76rem; font-weight: 700; line-height: 1.25; }
.pet-on { position: absolute; top: 9px; right: 9px; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: .65rem; background: var(--p); color: #fff; }
@media (max-width: 640px) {
  .pet-hero { flex-direction: column; text-align: center; padding: 16px; gap: 6px; }
  .pet-stage { flex-basis: auto; width: 180px; height: 180px; }
  .pet-pic-big { width: 180px; height: 180px; }
  .pet-tags { justify-content: center; }
  .pet-hero-d, .pet-name-row { margin-left: auto; margin-right: auto; }
  .pet-grid-breeds { grid-template-columns: repeat(2, 1fr); }
  .pet-grid-colors { grid-template-columns: repeat(3, 1fr); }
  .pet-card-sm .pet-pic { width: 84px; height: 84px; }
}

/* ===== Фотобудка (photobooth.js) ===== */
html.pb-open { overflow: hidden; }
.pb-root { position: fixed; inset: 0; z-index: 10050; background: rgba(5,4,9,.82); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 18px; }
.pb-win { width: min(1320px, 100%); height: min(860px, 100%); display: flex; flex-direction: column; border-radius: 18px; overflow: hidden;
  background: #121118; border: 1px solid rgba(255,255,255,.08); box-shadow: 0 30px 80px rgba(0,0,0,.6); color: #fff; }
.pb-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; font-weight: 800; font-size: 1.02rem; border-bottom: 1px solid rgba(255,255,255,.06); }
.pb-head > i { color: rgb(var(--p-rgb)); filter: brightness(1.4); }
.pb-sub { color: #9ca0ab; font-weight: 600; font-size: .85rem; margin-right: auto; }
.pb-x { width: 34px; height: 34px; border-radius: 10px; border: 0; background: rgba(255,255,255,.06); color: #fff; cursor: pointer; }
.pb-x:hover { background: rgba(255,255,255,.12); }
.pb-body { flex: 1; min-height: 0; display: flex; }
.pb-stagewrap { flex: 1; min-width: 0; display: flex; align-items: center; justify-content: center; padding: 14px; background: radial-gradient(60% 60% at 50% 40%, rgba(var(--p-rgb), .10), transparent 70%); }
.pb-stage { position: relative; border-radius: 12px; overflow: hidden; box-shadow: 0 10px 40px rgba(0,0,0,.5); filter: var(--pbf, none); }
.pb-bg, .pb-gl, .pb-fx, .pb-vig, .pb-grain, .pb-flash, .pb-load, .pb-count { position: absolute; inset: 0; width: 100%; height: 100%; }
.pb-gl { cursor: grab; touch-action: none; }
.pb-gl:active { cursor: grabbing; }
.pb-fx, .pb-vig, .pb-grain, .pb-flash, .pb-count { pointer-events: none; }
.pb-vig { background: radial-gradient(ellipse at center, transparent 45%, rgba(0,0,0,.9) 100%); }
.pb-grain { mix-blend-mode: overlay; image-rendering: pixelated; }
.pb-flash { background: #fff; opacity: 0; }
.pb-flash.go { animation: pbFlash .45s ease-out; }
@keyframes pbFlash { 0% { opacity: .95; } 100% { opacity: 0; } }
.pb-count { display: flex; align-items: center; justify-content: center; font-size: 7rem; font-weight: 900; color: #fff; text-shadow: 0 6px 30px rgba(0,0,0,.6); }
.pb-count.pop { animation: pbPop .9s ease-out; }
@keyframes pbPop { 0% { transform: scale(1.6); opacity: 0; } 25% { transform: scale(1); opacity: 1; } 100% { opacity: .2; } }
.pb-load { display: flex; flex-direction: column; gap: 12px; align-items: center; justify-content: center; background: rgba(10,9,14,.75); font-weight: 700; color: #c9ccd4; }
.pb-load[hidden] { display: none; }
.pb-spin { width: 38px; height: 38px; border-radius: 50%; border: 3px solid rgba(255,255,255,.15); border-top-color: rgb(var(--p-rgb)); animation: pbSpin 1s linear infinite; }
@keyframes pbSpin { to { transform: rotate(360deg); } }
.pb-hint { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); padding: 5px 12px; border-radius: 999px; font-size: .72rem; color: #e5e7eb;
  background: rgba(0,0,0,.45); pointer-events: none; transition: opacity .6s; white-space: nowrap; }
.pb-hint.gone { opacity: 0; }
.pb-side { width: 330px; flex: 0 0 330px; display: flex; flex-direction: column; border-left: 1px solid rgba(255,255,255,.06); background: #16151c; min-height: 0; }
.pb-tabs { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; padding: 8px; border-bottom: 1px solid rgba(255,255,255,.06); }
.pb-tab { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 2px; border-radius: 10px; border: 0; background: transparent; color: #9ca0ab; cursor: pointer; font: inherit; }
.pb-tab i { font-size: 1rem; }
.pb-tab span { font-size: .64rem; font-weight: 700; }
.pb-tab:hover { background: rgba(255,255,255,.04); color: #fff; }
.pb-tab.on { background: rgba(var(--p-rgb), .18); color: #fff; }
.pb-tab.on i { color: rgb(var(--p-rgb)); filter: brightness(1.4); }
.pb-panel { flex: 1; overflow-y: auto; padding: 10px 12px 16px; }
.pb-cap { font-size: .72rem; font-weight: 700; color: #9ca0ab; margin: 6px 2px 8px; }
.pb-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.pb-grid-s { grid-template-columns: repeat(3, 1fr); }
.pb-it { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 78px; padding: 8px 4px; border-radius: 12px; cursor: pointer;
  background: #1c1b23; border: 1px solid rgba(255,255,255,.07); color: #fff; font: inherit; transition: border-color .15s, background .15s, transform .12s; }
.pb-it:hover { border-color: rgba(var(--p-rgb), .5); transform: translateY(-1px); }
.pb-it:active { transform: scale(.97); }
.pb-it.on { border-color: rgba(var(--p-rgb), .9); background: radial-gradient(90% 80% at 50% 30%, rgba(var(--p-rgb), .25), transparent 75%), #1c1b23; }
.pb-it small { font-size: .7rem; font-weight: 700; color: #d1d5db; text-align: center; line-height: 1.2; }
.pb-ico { width: 30px; height: 30px; background: #e5e7eb; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; }
.pb-it.on .pb-ico { background: #fff; }
.pb-num { width: 32px; height: 32px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 900; background: rgba(255,255,255,.07); }
.pb-it.on .pb-num { background: rgb(var(--p-rgb)); }
.pb-hatpic { width: 58px; height: 58px; background: url(/skins/pets3d/hats_sprite.webp) no-repeat; background-size: 1000% 100%; background-position: calc(var(--p) * 100% / 9) 0; }
.pb-none { font-size: 1.5rem; color: #6b7280; height: 58px; display: flex; align-items: center; }
.pb-fprev { width: 54px; height: 38px; border-radius: 8px; background: linear-gradient(135deg, #f59e0b, #ec4899 45%, #3b82f6); }
.pb-sprev { width: 100%; height: 44px; border-radius: 8px; background-size: cover; background-position: center; }
.pb-asp { width: 44px; max-height: 40px; border: 2px solid #d1d5db; border-radius: 4px; }
.pb-it.on .pb-asp { border-color: #fff; }
.pb-light-ct i { color: #60a5fa; } .pb-light-t i { color: #f59e0b; } .pb-light-none i { color: #fef3c7; }
.pb-sl { display: flex; flex-direction: column; gap: 4px; margin: 10px 2px; font-size: .74rem; font-weight: 700; color: #9ca0ab; }
.pb-sl input { accent-color: rgb(var(--p-rgb)); width: 100%; }
.pb-foot { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid rgba(255,255,255,.06); background: #14131a; }
.pb-btn { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; border-radius: 10px; border: 1px solid rgba(255,255,255,.08); background: #1f1e27; color: #e5e7eb;
  font: inherit; font-size: .82rem; font-weight: 700; cursor: pointer; text-decoration: none; }
.pb-btn:hover { background: #292833; color: #fff; }
.pb-shoot { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; border-radius: 12px; border: 0; background: var(--p); color: #fff;
  font: inherit; font-weight: 800; font-size: .92rem; cursor: pointer; text-decoration: none; box-shadow: 0 6px 22px rgba(var(--p-rgb), .45); }
.pb-shoot:hover { filter: brightness(1.12); }
.pb-shoot:disabled { opacity: .6; cursor: default; }
.pb-album-btn { padding: 7px 12px; }
.pb-result { position: fixed; inset: 0; z-index: 10060; background: rgba(0,0,0,.72); display: flex; align-items: center; justify-content: center; padding: 20px; }
.pb-result[hidden] { display: none; }
.pb-res-card { max-width: min(1000px, 100%); background: #16151c; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; padding: 14px; box-shadow: 0 30px 80px rgba(0,0,0,.6);
  animation: pbIn .35s cubic-bezier(.2,1.4,.4,1); }
@keyframes pbIn { from { transform: scale(.85) rotate(-2deg); opacity: 0; } to { transform: none; opacity: 1; } }
.pb-res-card img { display: block; max-width: 100%; max-height: 70vh; border-radius: 10px; }
.pb-res-btns { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.pb-res-btns .pb-shoot { margin-left: 0; }
.pb-res-msg { margin-top: 8px; font-size: .8rem; color: #9ca0ab; min-height: 1em; }
.pb-res-msg.ok { color: #4ade80; } .pb-res-msg.bad { color: #f87171; }
@media (max-width: 900px) {
  .pb-root { padding: 0; }
  .pb-win { height: 100%; border-radius: 0; }
  .pb-body { flex-direction: column; }
  .pb-stagewrap { flex: 0 0 auto; height: 46vh; padding: 8px; }
  .pb-side { width: auto; flex: 1; border-left: 0; border-top: 1px solid rgba(255,255,255,.06); }
  .pb-grid, .pb-grid-s { grid-template-columns: repeat(4, 1fr); }
  .pb-foot { flex-wrap: wrap; }
  .pb-foot .pb-btn span { display: none; }
}

/* ===== Окно питомца: 3D и эмоции ===== */
.pet-stage3d { position: relative; flex: 0 0 260px; width: 260px; height: 260px; }
.pet-stage3d .pv-canvas { position: absolute; inset: 0; width: 100% !important; height: 100% !important; cursor: grab; touch-action: pan-y; z-index: 1; }
.pet-stage3d .pet-pic-big { position: absolute; inset: 20px; width: auto; height: auto; }
.pet-stage3d.live .pet-pic-big { opacity: 0; transition: opacity .4s; }
.pet-emos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.pet-emo { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04);
  color: #d1d5db; font: inherit; font-size: .74rem; font-weight: 700; cursor: pointer; }
.pet-emo:hover { border-color: rgba(var(--p-rgb), .5); color: #fff; }
.pet-emo.on { background: rgba(var(--p-rgb), .22); border-color: rgba(var(--p-rgb), .7); color: #fff; }
.pet-emo .pb-ico { width: 16px; height: 16px; }
.pet-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.pet-act { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); background: #1f1e27;
  color: #fff; font: inherit; font-weight: 800; font-size: .84rem; cursor: pointer; }
.pet-act:hover { border-color: rgba(var(--p-rgb), .6); }
.pet-act i { color: rgb(var(--p-rgb)); filter: brightness(1.4); }
.pet-act.main { background: var(--p); border-color: transparent; box-shadow: 0 6px 20px rgba(var(--p-rgb), .35); }
.pet-act.main i { color: #fff; filter: none; }

/* корм */
.pet-feed { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 14px 18px; border-radius: 14px; background: var(--sk2-panel, #16151c); border: 1px solid var(--sk2-line, rgba(255,255,255,.08)); }
.pet-feed-ico { width: 84px; height: 63px; flex: 0 0 84px; background: url(/skins/pets3d/chicken_feed_bag_2.webp) center / contain no-repeat; filter: drop-shadow(0 4px 10px rgba(0,0,0,.4)); }
.pet-egg2 { background: url(/skins/pets3d/chicken_egg.webp) center / 88% no-repeat; }
.pet-feed-i { flex: 1; min-width: 180px; }
.pet-feed-t { font-weight: 800; font-size: .92rem; }
.pet-feed-t.hungry { color: #f87171; }
.pet-feed-bar { height: 8px; border-radius: 999px; background: rgba(255,255,255,.07); overflow: hidden; margin: 7px 0 5px; }
.pet-feed-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #f59e0b, #4ade80); }
.pet-feed-d { font-size: .74rem; color: var(--sk2-mut, #9ca0ab); }
.pet-feed-btns { display: flex; gap: 8px; flex-wrap: wrap; }

/* шляпы во вкладке */
.pet-hatpic { display: block; width: 92px; height: 92px; background: url(/skins/pets3d/hats_sprite.webp) no-repeat; background-size: 1000% 100%; background-position: calc(var(--p) * 100% / 9) 0; }

/* альбом */
.pa-root { position: fixed; inset: 0; z-index: 10040; background: rgba(5,4,9,.82); backdrop-filter: blur(6px); display: flex; align-items: center; justify-content: center; padding: 18px; }
.pa-win { width: min(1100px, 100%); max-height: 100%; display: flex; flex-direction: column; background: #121118; border: 1px solid rgba(255,255,255,.08); border-radius: 18px; overflow: hidden; color: #fff; }
.pa-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; font-weight: 800; border-bottom: 1px solid rgba(255,255,255,.06); }
.pa-head > i { color: rgb(var(--p-rgb)); filter: brightness(1.4); }
.pa-cnt { color: #9ca0ab; font-size: .8rem; font-weight: 700; margin-right: auto; }
.pa-body { overflow-y: auto; padding: 16px; }
.pa-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; }
.pa-ph { position: relative; background: #f4f1ea; padding: 8px 8px 30px; border-radius: 4px; box-shadow: 0 8px 22px rgba(0,0,0,.45); cursor: zoom-in; transition: transform .2s; }
.pa-ph:nth-child(3n+1) { transform: rotate(-1.4deg); } .pa-ph:nth-child(3n+2) { transform: rotate(1deg); } .pa-ph:nth-child(3n) { transform: rotate(-.4deg); }
.pa-ph:hover { transform: rotate(0) scale(1.03); z-index: 2; }
.pa-ph img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; background: #ddd; }
.pa-ph small { position: absolute; left: 10px; right: 34px; bottom: 7px; color: #3f3a33; font-size: .72rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pa-del { position: absolute; right: 6px; bottom: 4px; width: 24px; height: 24px; border: 0; border-radius: 6px; background: transparent; color: #9a8f80; cursor: pointer; }
.pa-del:hover { color: #dc2626; background: rgba(220,38,38,.1); }
.pa-empty { text-align: center; padding: 50px 10px; color: #9ca0ab; }
.pa-empty i { font-size: 2.4rem; color: rgba(var(--p-rgb), .8); display: block; margin-bottom: 12px; }
.pa-view { position: fixed; inset: 0; z-index: 10045; background: rgba(0,0,0,.88); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; padding: 20px; }
.pa-view img { max-width: 100%; max-height: 82vh; border-radius: 8px; box-shadow: 0 20px 60px rgba(0,0,0,.6); }
@media (max-width: 640px) {
  .pet-stage3d { width: 200px; height: 200px; flex-basis: auto; }
  .pa-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
}
.pet-tags span.ok { color: #bbf7d0; background: rgba(34,197,94,.16); border-color: rgba(34,197,94,.35); }
.pet-tags span.bad { color: #fecaca; background: rgba(239,68,68,.16); border-color: rgba(239,68,68,.4); }
.pet-hat-none { display: flex; align-items: center; justify-content: center; font-size: 1.6rem; color: #6b7280; background: none; }
.pet-card-sm .pet-hatpic { width: 100px; height: 100px; }
.pet-qty { padding: 9px 10px; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); background: #1f1e27; color: #fff; font: inherit; font-weight: 700; }
.pet-act:disabled { opacity: .45; cursor: default; }
.pv-heart { position: absolute; z-index: 3; pointer-events: none; color: #f472b6; text-shadow: 0 2px 8px rgba(236,72,153,.6); transform: translate(-50%, -50%); animation: pvHeart 1.4s ease-out forwards; opacity: 0; }
@keyframes pvHeart { 0% { opacity: 0; transform: translate(-50%, -50%) scale(.4); } 15% { opacity: 1; transform: translate(-50%, -70%) scale(1.1); } 100% { opacity: 0; transform: translate(-50%, -260%) scale(.9) rotate(12deg); } }
.pet-stats { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 8px; font-size: .74rem; color: var(--sk2-mut, #9ca0ab); }
.pet-stats b { color: #fff; font-weight: 800; }
.pet-poke-hint { position: absolute; left: 50%; bottom: 6px; transform: translateX(-50%); z-index: 2; font-size: .66rem; color: #d1d5db; background: rgba(0,0,0,.45); padding: 3px 9px; border-radius: 999px; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .4s; }
.pet-stage3d.live .pet-poke-hint { opacity: 1; }
.pet-mute { margin-left: 6px; width: 24px; height: 24px; border-radius: 7px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.05); color: #d1d5db; cursor: pointer; font-size: .7rem; vertical-align: middle; }
.pet-mute:hover { color: #fff; border-color: rgba(var(--p-rgb), .6); }
.pet-ns { margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.06); max-width: 560px; display: flex; flex-direction: column; gap: 8px; }
.pet-ns-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.pet-ns-l { font-size: .74rem; color: var(--sk2-mut, #9ca0ab); font-weight: 700; }
.pet-ns-prev { font-weight: 800; text-shadow: 0 2px 6px rgba(0,0,0,.7); padding: 2px 10px; border-radius: 8px; background: rgba(0,0,0,.35); }
.pet-ns-prev.off { opacity: .35; text-decoration: line-through; }
.pet-ns-b { padding: 5px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.04); color: #d1d5db; font: inherit; font-size: .74rem; font-weight: 700; cursor: pointer; }
.pet-ns-b.on { background: rgba(var(--p-rgb), .25); border-color: rgba(var(--p-rgb), .75); color: #fff; }
.pet-ns-sep { width: 1px; height: 18px; background: rgba(255,255,255,.1); margin: 0 4px; }
.pet-ns-c { width: 22px; height: 22px; border-radius: 50%; border: 2px solid rgba(255,255,255,.15); cursor: pointer; padding: 0; }
.pet-ns-c.on { border-color: #fff; box-shadow: 0 0 0 2px rgba(var(--p-rgb), .8); }
.pet-ns-pick { width: 30px; height: 26px; border: 0; background: none; cursor: pointer; padding: 0; }
.pet-ns-hint { font-size: .68rem; color: var(--sk2-mut, #9ca0ab); }

/* фотобудка: агент и друг */
.pb-fr-q { width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.1); background: rgba(0,0,0,.3); color: #fff; font: inherit; font-size: .84rem; outline: none; margin-bottom: 8px; }
.pb-fr-q:focus { border-color: rgba(var(--p-rgb), .6); }
.pb-fr { display: flex; align-items: center; gap: 10px; width: 100%; padding: 7px 9px; margin-bottom: 6px; border-radius: 10px; border: 1px solid rgba(255,255,255,.07); background: #1c1b23; color: #fff; font: inherit; text-align: left; cursor: pointer; }
.pb-fr:hover:not(:disabled) { border-color: rgba(var(--p-rgb), .5); }
.pb-fr:disabled { opacity: .45; cursor: default; }
.pb-fr.on { border-color: rgba(var(--p-rgb), .8); cursor: default; }
.pb-fr img { width: 32px; height: 32px; border-radius: 50%; flex: 0 0 32px; background: #2a2833; }
.pb-fr span { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.pb-fr b { font-size: .82rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-fr small { font-size: .7rem; color: #9ca0ab; }
.pb-fr .pb-btn { padding: 6px 9px; }
.pet-vol, .pb-vol { width: 90px; accent-color: rgb(var(--p-rgb)); vertical-align: middle; margin-left: 6px; cursor: pointer; }
.pb-vol { width: 80px; }
.pb-ag { display: flex; align-items: center; gap: 10px; width: 100%; padding: 8px 10px; margin-bottom: 6px; border-radius: 10px; border: 1px solid rgba(255,255,255,.07); background: #1c1b23; color: #fff; font: inherit; text-align: left; cursor: pointer; }
.pb-ag:hover { border-color: rgba(var(--p-rgb), .5); }
.pb-ag.on { border-color: rgba(var(--p-rgb), .9); background: radial-gradient(90% 90% at 0% 50%, rgba(var(--p-rgb), .22), transparent 75%), #1c1b23; }
.pb-ag > i { width: 26px; text-align: center; color: #c9ccd4; }
.pb-ag span { display: flex; flex-direction: column; min-width: 0; }
.pb-ag b { font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pb-ag small { font-size: .68rem; color: #9ca0ab; }
/* Сиамский кот (ЗБТ) */
.pet-cat { display: flex; flex-direction: column; gap: 10px; }
.pet-beta { font-size: .66rem; font-weight: 900; letter-spacing: .08em; color: #1b1206; background: linear-gradient(135deg, #f5e6c8, #c89b6a); padding: 2px 8px; border-radius: 999px; }
.pet-cat .pet-hero { background: radial-gradient(60% 120% at 12% 60%, rgba(214,178,130,.22), transparent 70%), var(--sk2-panel, #16151c); border-color: rgba(214,178,130,.28); }
.pet-cat-stage { flex: 0 0 320px; width: 320px; height: 260px; border-radius: 14px; background: radial-gradient(70% 45% at 50% 78%, rgba(255,255,255,.07), transparent 70%); }
.pet-cat .pet-emo i { margin-right: 4px; opacity: .8; }
@media (max-width: 640px) { .pet-cat-stage { width: 100%; max-width: 340px; height: 230px; flex-basis: auto; } }