/* ChooseGiftView.lua / item_choose.json: original 608 × 632 panel and assets. */
#home-first-gift-entry[hidden], .first-gift-dialog [hidden] { display:none !important; }
.first-gift-dialog { position:fixed; inset:0; padding:0; margin:auto; border:0; outline:0; max-width:none; max-height:none; overflow:visible; background:transparent; box-shadow:none; }
.first-gift-dialog::backdrop { background:rgb(0 0 0 / .58); }
.first-gift-panel { position:relative; width:608px; height:632px; transform-origin:top left; color:#61391c; font:24px/1.3 Arial,"Microsoft YaHei",sans-serif; }
.first-gift-panel * { box-sizing:border-box; }
.first-gift-background { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; background:var(--first-panel-bg) center/100% 100% no-repeat; }
.first-gift-close { position:absolute; right:4px; top:6px; width:104px; height:96px; border:0; padding:22px 26px; background:transparent; z-index:2; }
.first-gift-close img { width:52px; height:52px; }
.first-gift-close-text { display:none; }
.first-gift-title { position:absolute; left:90px; right:90px; top:32px; margin:0; text-align:center; font-size:34px; color:#ffe49c; text-shadow:2px 2px #582509,-2px -2px #582509,2px -2px #582509,-2px 2px #582509; }
.first-gift-title img { width:130px; height:34px; display:block; margin:3px auto; }
.first-gift-caption { position:absolute; top:103px; left:45px; right:45px; margin:0; text-align:center; font-size:22px; }
.first-gift-list { position:absolute; left:64px; top:139px; width:480px; height:240px; display:flex; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; touch-action:pan-x; -webkit-overflow-scrolling:touch; scrollbar-width:none; scroll-snap-type:x proximity; }
.first-gift-list::-webkit-scrollbar { display:none; }
.first-gift-cell { position:relative; display:block; flex:0 0 160px; height:240px; margin:0; padding:0; text-align:center; scroll-snap-align:start; cursor:pointer; }
.first-gift-icon { position:absolute; top:32px; left:30px; width:100px; height:100px; object-fit:contain; }
.first-gift-name { position:absolute; top:137px; left:6px; width:148px; font-size:20px; line-height:24px; color:#a85b06; overflow-wrap:anywhere; }
.first-gift-check { appearance:none; -webkit-appearance:none; position:absolute; left:44px; top:164px; width:71px; height:73px; margin:0; border:0; border-radius:0; background:var(--first-check-bg) center/71px 73px no-repeat; cursor:pointer; }
.first-gift-check:checked { background-image:var(--first-check-mark),var(--first-check-bg); }
.first-gift-check:focus-visible { outline:3px solid #b77116; outline-offset:-4px; }
.first-gift-check:disabled { opacity:.35; cursor:default; }
.first-gift-acquired { position:absolute; top:30px; left:23px; padding:3px 5px; background:#684217; color:#fff0c6; font-size:18px; }
.first-gift-count { position:absolute; top:192px; left:0; width:100%; font-size:24px; }
.first-gift-arrow { position:absolute; top:210px; width:60px; height:100px; border:0; padding:24px 17px; background:transparent; }
.first-gift-arrow img { width:26px; height:51px; animation:first-gift-arrow 1.5s ease-in-out infinite alternate; }
.first-gift-arrow.is-left { left:8px; transform:rotate(180deg); }
.first-gift-arrow.is-right { right:8px; }
.first-gift-detail { position:absolute; top:402px; left:32px; right:32px; margin:0; text-align:center; font-size:24px; }
.first-gift-quantity { position:absolute; top:438px; left:249px; width:110px; height:51px; text-align:center; line-height:51px; background:var(--first-number-bg) center/100% 100%; font-weight:bold; }
.first-gift-accept { position:absolute; left:225px; top:512px; width:158px; height:72px; border:0; padding:0; white-space:nowrap; background:var(--first-button-bg) center/100% 100% no-repeat; font:bold 28px/72px Arial,"Microsoft YaHei",sans-serif; color:#fff1ac; text-shadow:1px 2px #77380a; }
.first-gift-native-skin { position:absolute; inset:0; width:100%; height:100%; pointer-events:none; }
.first-gift-accept > span { position:relative; z-index:1; }
.first-gift-panel .has-native-skin { background:none; }
.first-gift-quantity .first-gift-native-skin { z-index:-1; }
.first-gift-quantity { isolation:isolate; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-accept { left:154px; width:300px; }
.first-gift-accept:disabled { filter:saturate(.45); opacity:.7; }
.first-gift-status { position:absolute; left:38px; right:38px; top:588px; margin:0; text-align:center; font-size:17px; line-height:20px; color:#9f3828; }
@keyframes first-gift-arrow { from {opacity:.3;} to {opacity:1;} }
@media(prefers-reduced-motion:reduce) { .first-gift-arrow img {animation:none;} }

/* First-charge offer. Skin-pack styles below retain only the original skin art. */
.first-gift-converted { font-size:10px; color:#858c99; line-height:14px; }
.first-gift-dialog:not(.is-skin-pack) { inset:auto; top:50%; left:50%; margin:0; transform:translate(-50%,-50%); overflow:auto; overscroll-behavior:contain; border:1px solid #e0e3eb; border-radius:0; background:#fff; color:#303640; box-shadow:0 16px 48px #17212b33; }
.first-gift-dialog:not(.is-skin-pack)::backdrop { background:#17212baa; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-panel { width:100%; height:auto; min-height:100%; padding:24px 20px 20px; color:#303640; font:14px/1.5 Arial,"Microsoft YaHei",sans-serif; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-background,
.first-gift-dialog:not(.is-skin-pack) .first-gift-native-skin,
.first-gift-dialog:not(.is-skin-pack) .first-gift-close img { display:none; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-close { top:16px; right:16px; width:44px; height:44px; padding:0; border:1px solid #dce0e8; border-radius:0; color:#89909d; background:#fff; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-close-text { display:block; font:30px/40px Arial,sans-serif; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-title { position:static; margin:0; padding:0 52px 4px 0; text-align:left; color:#303640; font-size:24px; line-height:32px; text-shadow:none; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-caption { position:static; margin:0; padding:0 0 20px; text-align:left; color:#fb5c8a; font-size:13px; line-height:20px; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-list { position:static; width:100%; height:218px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:20px 0; border-block:1px solid #e3e6ed; overflow:visible; touch-action:pan-y; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-cell { display:flex; flex-direction:column; align-items:center; width:auto; height:176px; padding:12px 5px; border:1px solid #ffd6e3; background:#fff7fa; cursor:default; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-icon { position:static; width:72px; max-width:100%; height:72px; margin-bottom:8px; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-name { position:static; width:100%; color:#505765; font-size:14px; line-height:20px; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-count { position:static; width:auto; margin-top:auto; padding-top:6px; color:#fb5c8a; font-size:17px; line-height:22px; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-detail { position:static; margin:18px 0; text-align:left; color:#727987; font-size:13px; line-height:20px; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-accept { position:static; display:block; width:100%; height:auto; min-height:48px; padding:12px 8px; border:1px solid #ff6794; border-radius:0; background:#ff6794; color:#fff; font:bold 16px/24px Arial,"Microsoft YaHei",sans-serif; text-shadow:none; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-accept:disabled { filter:none; opacity:.5; }
.first-gift-dialog:not(.is-skin-pack) .first-gift-status { position:static; min-height:20px; margin:10px 0 0; color:#858c99; font-size:12px; line-height:20px; }
.first-gift-dialog:not(.is-skin-pack) button:focus-visible { outline:2px solid #ff6794; outline-offset:3px; }
@media(max-width:350px) {
  .first-gift-dialog:not(.is-skin-pack) .first-gift-panel { padding:22px 14px 16px; }
  .first-gift-dialog:not(.is-skin-pack) .first-gift-title { font-size:22px; }
  .first-gift-dialog:not(.is-skin-pack) .first-gift-caption { font-size:12px; }
  .first-gift-dialog:not(.is-skin-pack) .first-gift-icon { width:58px; height:58px; }
  .first-gift-dialog:not(.is-skin-pack) .first-gift-name { font-size:12px; line-height:18px; }
}

.first-gift-dialog.is-skin-pack { box-sizing:border-box; inset:auto; top:50%; left:50%; margin:0; transform:translate(-50%,-50%); border:1px solid #f0e3e8; border-radius:0; background:#fff; color:#444b55; overflow:hidden; }
.first-gift-dialog.is-skin-pack::backdrop { background:#17212b80; }
.is-skin-pack .first-gift-panel { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-rows:44px 26px minmax(0,1fr) 44px 36px; gap:8px; width:100%; height:100%; padding:16px; color:#444b55; font:14px/1.5 Arial,"Microsoft YaHei",sans-serif; }
.is-skin-pack .first-gift-background,.is-skin-pack .first-gift-native-skin,.is-skin-pack .first-gift-close img { display:none; }
.is-skin-pack .first-gift-close { top:16px; right:16px; width:44px; height:44px; padding:0; border:1px solid #ff719a; border-radius:0; background:#fff; color:#ed5c8a; }
.is-skin-pack .first-gift-close-text { display:block; font:28px/42px Arial,sans-serif; }
.is-skin-pack .first-gift-title { position:static; grid-area:1/1/2/3; align-self:center; padding-right:48px; color:#444b55; text-align:left; font-size:20px; line-height:26px; text-shadow:none; }
.is-skin-pack .first-gift-caption { position:static; grid-area:2/1/3/3; align-self:center; padding-right:76px; text-align:left; color:#9298a3; font-size:12px; line-height:20px; }
.is-skin-pack .first-gift-list { position:static; grid-area:3/1/4/3; width:100%; height:100%; min-height:0; gap:8px; overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory; }
.is-skin-pack .first-gift-cell { display:flex; flex-direction:column; align-items:center; gap:4px; flex:0 0 calc((100% - 16px)/3); height:100%; padding:8px 4px; border:1px solid #dfe2e6; background:#fff; }
.is-skin-pack .first-gift-cell.is-selected { border-color:#ff719a; background:#fff5f8; }
.is-skin-pack .first-gift-icon { position:static; width:64px; height:64px; max-width:100%; flex-shrink:0; }
.is-skin-pack .first-gift-name { position:static; width:100%; color:#505765; font-size:12px; line-height:16px; }
.is-skin-pack .first-gift-check { position:static; flex-shrink:0; width:20px; height:20px; margin:auto 0 0; border:1px solid #ff719a; border-radius:0; background:#fff; }
.is-skin-pack .first-gift-check:checked { background:#ff719a; }
.is-skin-pack .first-gift-check:checked::after { content:'✓'; display:block; color:#fff; font:16px/18px Arial,sans-serif; text-align:center; }
.is-skin-pack .first-gift-check:focus-visible { outline:2px solid #ff719a; outline-offset:2px; }
.is-skin-pack .first-gift-acquired { top:8px; left:4px; right:4px; padding:2px; background:#fff0f6ed; color:#ed5c8a; font-size:11px; }
.is-skin-pack .first-gift-arrow { top:68px; width:28px; height:26px; padding:0; border:1px solid #ff719a; border-radius:0; background:#fff; color:#ed5c8a; font:24px/22px Arial,sans-serif; }
.is-skin-pack .first-gift-arrow.is-left { left:auto; right:52px; transform:none; }
.is-skin-pack .first-gift-arrow.is-right { right:16px; }
.is-skin-pack .first-gift-detail { position:static; grid-area:4/1/5/2; align-self:center; text-align:left; color:#727987; font-size:13px; }
.is-skin-pack .first-gift-accept { position:static; grid-area:4/2/5/3; width:auto; height:44px; padding:8px 14px; border:1px solid #ff6794; border-radius:0; background:#ff6794; color:#fff; font:14px/26px Arial,"Microsoft YaHei",sans-serif; text-shadow:none; }
.is-skin-pack .first-gift-accept:disabled { filter:none; opacity:.45; }
.is-skin-pack .first-gift-status { position:static; grid-area:5/1/6/3; height:36px; overflow:auto; scrollbar-width:none; color:#ed5c8a; text-align:left; font-size:12px; line-height:18px; }
.is-skin-pack .first-gift-status::-webkit-scrollbar { display:none; }
@media(max-height:420px) {
  .is-skin-pack .first-gift-panel { grid-template-rows:40px 24px minmax(0,1fr) 40px 18px; gap:6px; padding:12px; }
  .is-skin-pack .first-gift-close { top:10px; right:12px; }
  .is-skin-pack .first-gift-icon { width:48px; height:48px; }
  .is-skin-pack .first-gift-arrow { top:58px; }
  .is-skin-pack .first-gift-status { height:18px; }
}