/* ═══════════════════════════════════════════════════════════════════════════
 *  v371 · «عرشهٔ من» — بخش میانی صفحهٔ پروفایل، جمع‌وجور و قدرتمند
 *
 *  قبلاً: چهار کارت بزرگ (خزانه، آتلیه، قلمرو ماجرا، سفیران) روی هم ≈ ۲۴۰px،
 *  شبکهٔ ۸تایی گشاد و فهرست ۷ ردیفهٔ بلند؛ نیمی از صفحه خالیِ رنگ بود.
 *  حالا (ساختار در 190-v148.js → deck()):
 *   ۱) نوار خزانه: یک ردیف تیرهٔ نیلی‌بنفش، صندوق در حلقهٔ شیشه‌ای، دو کپسول سکه/الماس، دکمهٔ طلایی «+»
 *   ۲) سه کاشی هم‌قد کنار هم: آتلیه (صورتی→بنفش)، قلمرو ماجرا (نارنجی→سرخ)، سفیران (فیروزه‌ای→آبی)؛
 *      هنر هر کاشی گوشهٔ بالا، نام و زیرنویس دو خطی پایین
 *   ۳) شبکهٔ ۸تایی فشرده‌تر (کاشی ۴۶px، برچسب ۱۰٫۵px)
 *   ۴) جعبه‌ابزار دو ستونه با زیرنویس یا وضعیت زیر هر نام؛ ردیف تک‌ماندهٔ آخر تمام‌عرض
 *  کلاس‌های du230-w / du230-m / ad230-q / ad230-i / qk148 / ls148 و ساختار داخلی‌شان عمداً حفظ شده
 *  تا استودیوی آیکن پنل (304-v319: عکس، نام، زیرنویس، برچسب، بنر کامل bn319) بدون تغییر کار کند.
 *  هیچ انیمیشن تازه‌ای ندارد (چرخه‌های قبلی صندوق و بال‌ها سر جایشان‌اند).
 * ═══════════════════════════════════════════════════════════════════════════ */

/* ─── عرشه: ۳ ستون؛ نوار خزانه تمام‌عرض، سه کاشی زیرش ─── */
.pd371{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:10px }
.pd371 > button{ position:relative; min-width:0; border:0; cursor:pointer; text-align:start; font:inherit; color:#fff; overflow:hidden; isolation:isolate;
  -webkit-tap-highlight-color:transparent; transition:transform .12s }
.pd371 > button:active{ transform:scale(.97) }

/* ─── ۱) نوار خزانه ─── */
.pd371 > .pw371{ grid-column:1 / -1; display:grid; grid-template-columns:auto minmax(0,1fr) auto; grid-template-rows:auto auto; column-gap:10px; align-items:center;
  min-height:64px; padding:8px 10px; border-radius:20px;
  background:radial-gradient(70% 130% at 100% 0%,rgba(245,197,66,.26),transparent 60%),radial-gradient(60% 110% at 0% 100%,rgba(236,72,153,.32),transparent 60%),linear-gradient(115deg,#1E1B4B 0%,#312E81 48%,#4C1D95 100%);
  box-shadow:0 14px 28px -16px rgba(49,46,129,.95), inset 0 1px 0 rgba(255,255,255,.16), inset 0 0 0 1px rgba(255,255,255,.06) }
.pd371 > .pw371::before{ content:""; position:absolute; inset:0; z-index:-1; background:repeating-linear-gradient(125deg,rgba(255,255,255,.035) 0 8px,transparent 8px 16px); pointer-events:none }
.pwa371{ grid-row:1 / 3; display:grid; place-items:center; width:50px; height:50px; border-radius:16px;
  background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.22),rgba(255,255,255,.06) 72%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14) }
.pwa371 .art150, .pwa371 .art150.chest{ width:46px; height:auto; max-width:none; margin:0; filter:drop-shadow(0 6px 8px rgba(0,0,0,.4)) }
.pd371 > .pw371 .du230-h{ grid-column:2; grid-row:1; display:flex; justify-content:flex-start; align-items:baseline; gap:6px; min-width:0 }
.pd371 > .pw371 .du230-h b{ flex:none; font-size:12px; font-weight:900; letter-spacing:.2px; color:#FDE68A; text-shadow:none }
.pd371 > .pw371 .du230-h small{ min-width:0; font-size:10px; font-weight:700; color:rgba(255,255,255,.62); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.pd371 > .pw371 .du230-v{ grid-column:2; grid-row:2; display:flex; flex-direction:row; flex-wrap:wrap; gap:5px; margin-top:4px; min-width:0 }
.pd371 > .pw371 .du230-v > span{ display:inline-flex; align-items:center; gap:4px; width:auto; height:26px; padding:0 9px 0 4px; border-radius:99px; direction:ltr;
  background:rgba(255,255,255,.12); box-shadow:inset 0 0 0 1px rgba(255,255,255,.14); backdrop-filter:none; -webkit-backdrop-filter:none }
.pd371 > .pw371 .du230-v svg{ flex:none; width:17px; height:17px }
.pd371 > .pw371 .du230-v b{ font-size:13.5px; font-weight:900; font-variant-numeric:tabular-nums; color:#fff }
.pd371 > .pw371 .du230-v > span:first-child b{ color:#FFE08A }
.pd371 > .pw371 .du230-v > span:last-child b{ color:#A5F3FC }
.pd371 > .pw371 .du230-p{ grid-column:3; grid-row:1 / 3; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; font-style:normal; color:#3B1D00;
  background:linear-gradient(180deg,#FFF1B8,#F5C542 60%,#D69A1F); box-shadow:0 8px 16px -8px rgba(245,197,66,.95), inset 0 1px 0 rgba(255,255,255,.7) }
.pd371 > .pw371 .du230-p svg{ width:16px; height:16px }

/* ─── ۲) سه کاشی ─── */
.pd371 > .pt371{ display:flex; flex-direction:column; justify-content:flex-end; gap:2px; min-height:108px; padding:9px 9px 8px; border-radius:18px;
  box-shadow:0 12px 22px -14px var(--g2), inset 0 1px 0 rgba(255,255,255,.38), inset 0 0 0 1px rgba(255,255,255,.12) }
.pd371 > .pt371::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(90% 60% at 100% 0%,rgba(255,255,255,.3),transparent 60%),linear-gradient(160deg,var(--g1),var(--g2)) }
.pd371 > .du230-m{ --g1:#FF8BC4; --g2:#8B5CF6 }
.pd371 > .ad230-q{ --g1:#FFB45C; --g2:#F43F5E }
.pd371 > .ad230-i{ --g1:#3EE6C3; --g2:#3B82F6 }
.pd371 > .pt371 > span{ position:relative; z-index:1; display:block; max-width:none; min-width:0 }
.pd371 > .pt371 b{ display:block; font-size:12.5px; font-weight:900; line-height:1.35; text-shadow:0 1px 3px rgba(0,0,0,.2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.pd371 > .pt371 small{ position:relative; z-index:1; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin:1px 0 0; max-width:none;
  font-size:10px; font-weight:800; line-height:1.5; opacity:.94 }
.pd371 > .pt371 .art150, .pd371 > .pt371 .art230{ position:absolute; top:5px; inset-inline-end:4px; width:52px; height:auto; max-width:none; margin:0; z-index:0;
  filter:drop-shadow(0 6px 8px rgba(0,0,0,.22)) }
.pd371 > .pt371 .ad230-dot{ top:8px; inset-inline-start:8px }
/* بنر کامل از پنل روی یک کاشی: هم‌قد همسایه‌هایش می‌ماند (نه نسبت ثابت خود بنر) */
.pd371 > .bn319{ aspect-ratio:auto !important; height:100% !important; min-height:108px !important }
.pd371 > .pw371.bn319{ min-height:64px !important }

/* ─── ۳) شبکهٔ ۸تایی فشرده ─── */
.me148.m230 .qk148{ margin-top:10px; padding:12px 4px 10px; gap:10px 2px; border-radius:22px;
  background:linear-gradient(180deg,#fff,#FBF8FF); box-shadow:0 12px 26px -20px rgba(124,58,237,.55), inset 0 0 0 1px rgba(139,92,246,.1) }
.me148.m230 .qk148 button{ gap:5px }
.me148.m230 .qk148 span{ width:46px; height:46px; border-radius:15px }
.me148.m230 .qk148 span svg{ width:34px; height:34px }
.me148.m230 .qk148 small{ font-size:10.5px; font-weight:800; color:#4B3F6B }
.me148.m230 .qk148 span > img.ic319{ width:calc(34px * var(--s,1)); height:calc(34px * var(--s,1)) }
.me148.m230 .qk148 span > img.ic319.full{ width:calc(46px * var(--s,1)); height:calc(46px * var(--s,1)) }

/* ─── ۴) جعبه‌ابزار دو ستونه ─── */
.me148.m230 .ls148{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; margin-top:10px; padding:7px; border-radius:22px;
  background:linear-gradient(180deg,#fff,#FBF8FF); box-shadow:0 12px 26px -20px rgba(124,58,237,.55), inset 0 0 0 1px rgba(139,92,246,.1) }
.me148.m230 .ls148 button{ display:grid; grid-template-columns:32px minmax(0,1fr); grid-template-rows:auto auto; column-gap:9px; row-gap:1px; align-items:center;
  width:100%; min-width:0; min-height:52px; padding:7px 9px; border:0 !important; border-radius:15px; background:#F7F4FD; box-shadow:inset 0 0 0 1px rgba(139,92,246,.07); text-align:start; cursor:pointer }
.me148.m230 .ls148 button:active{ background:#EFE9FA }
.me148.m230 .ls148 button:nth-child(odd):last-child{ grid-column:1 / -1 }
.me148.m230 .ls148 i{ grid-column:1; grid-row:1 / 3; width:32px; height:32px; border-radius:11px }
.me148.m230 .ls148 i svg{ width:22px; height:22px }  /* v452: آیکن‌های رنگی 48 */
.me148.m230 .ls148 i > img.ic319{ width:calc(18px * var(--s,1)); height:calc(18px * var(--s,1)) }
.me148.m230 .ls148 i > img.ic319.full{ width:calc(32px * var(--s,1)); height:calc(32px * var(--s,1)); border-radius:11px }
.me148.m230 .ls148 b{ grid-column:2; grid-row:1; min-width:0; font-size:12.5px; font-weight:900; line-height:1.3; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.me148.m230 .ls148 small{ grid-column:2; grid-row:2; min-width:0; font-size:10px; font-weight:700; color:var(--sub); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.me148.m230 .ls148 em{ grid-column:2; grid-row:2; justify-self:start; max-width:100%; box-sizing:border-box; padding:1px 7px; border-radius:99px; font-size:10px; font-weight:800; line-height:1.5;
  color:#6B5B8C; background:#EEE9F8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.me148.m230 .ls148 em.ok148{ color:#059669; background:#E7FBF1 }
.me148.m230 .ls148 em.nw148{ color:#fff; background:#F43F5E }
/* فلش در خانه‌های دوستونه جا می‌گیرد و فقط نام را می‌بُرد؛ خود خانه آشکارا لمس‌پذیر است */
.me148.m230 .ls148 .ch148{ display:none }

/* ─── گوشی‌های باریک ─── */
@media (max-width:360px){
  .pd371{ gap:6px }
  .pd371 > .pt371{ min-height:104px; padding:8px 8px 7px }
  .pd371 > .pt371 .art150, .pd371 > .pt371 .art230{ width:46px }
  .pd371 > .pw371{ column-gap:8px; padding:8px }
  .pd371 > .pw371 .du230-v b{ font-size:12.5px }
  .me148.m230 .ls148 button{ column-gap:7px; padding:7px }
}