@charset "UTF-8";
/* Original, unlabelled PNG layers supplied by the user; all text is live DOM. */
#panel-overlay:has(#game-window[data-panel="shop"]){z-index:40;justify-content:center;align-items:center;padding:16px 32px;background:#152d1a30;backdrop-filter:blur(2px)}
#game-window[data-panel="shop"]{--su:min(.078125vw,.138889dvh,1.22px);position:relative;width:calc(1150 * var(--su));height:calc(675 * var(--su));max-width:94vw;max-height:94dvh;overflow:visible;border:0;border-radius:0;background: url("../assets/ui-user/shop-frame.png") center bottom / 100% calc(100% - 35 * var(--su)) no-repeat;box-shadow:none;color:#876865;font-weight:800}
#game-window[data-panel="shop"] .window-header{position:absolute;inset:0;margin:0;padding:0;height:0;min-height:0;border:0;pointer-events:none}
#game-window[data-panel="shop"] .window-header>div{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#game-window[data-panel="shop"] #panel-close{position:absolute;right:calc(-13 * var(--su));top:calc(161 * var(--su));z-index:5;width:calc(67 * var(--su));height:calc(67 * var(--su));min-width:44px;min-height:44px;border:calc(9 * var(--su)) solid #b9683e;border-radius:24px;background:#ffab0c url("../assets/ui-user/shop-close.png") center / 53% no-repeat;font-size:0;pointer-events:auto;box-shadow:0 4px 8px #48321f12}
#game-window[data-panel="shop"] #panel-content{padding:0;overflow:auto;border-radius:0;scrollbar-color:#c59072 transparent;scrollbar-width:thin}
#game-window[data-panel="shop"] .window-footer{display:none}
.shop-art-layout.shop-layout{position:relative;display:grid;grid-template-columns:minmax(0,2.05fr) minmax(0,1fr);gap:calc(32 * var(--su));height:100%;min-height:0;padding:calc(151 * var(--su)) calc(76 * var(--su)) calc(42 * var(--su)) calc(105 * var(--su));isolation:isolate}
.shop-trade-tabs{position:absolute;left:calc(21 * var(--su));top:calc(-8 * var(--su));z-index:3;display:flex;align-items:start;gap:0;height:calc(155 * var(--su))}
.shop-trade-tab{display:grid;place-items:center;width:calc(225 * var(--su));height:calc(144 * var(--su));padding:calc(26 * var(--su));border:0;border-radius:0;background: url("../assets/ui-user/shop-sell-tab.png") center / 100% 100% no-repeat;transform:rotate(-9deg);color:#ecd792;font-size:calc(49 * var(--su));line-height:1;font-weight:900;letter-spacing:.02em}
.shop-trade-tab+.shop-trade-tab{margin-left:calc(-25 * var(--su));margin-top:calc(-22 * var(--su))}
.shop-trade-tab.active{z-index:2;width:calc(250 * var(--su));height:calc(159 * var(--su));background-image:url("../assets/ui-user/shop-buy-tab.png");transform:rotate(7deg)}
.shop-trade-tab>span{display:grid;place-items:center;width:100%;height:100%;padding:calc(16 * var(--su));background:url("../assets/ui-user/shop-sell-label-bg.png") center / 100% 100% no-repeat;text-shadow:0 3px 4px #476c4540}
.shop-trade-tab.active>span{background-image:url("../assets/ui-user/shop-buy-label-bg.png")}
.shop-trade-tab:hover:not(:disabled){filter:brightness(1.04)}
.shop-trade-tab:active:not(:disabled){transform:rotate(-9deg) translateY(2px)}
.shop-trade-tab.active:active:not(:disabled){transform:rotate(7deg) translateY(2px)}
.shop-trade-tabs:has([data-mode="sell"].active) [data-mode="buy"]>span{opacity:.55;filter:saturate(.5)}
.shop-trade-tabs [data-mode="sell"].active>span{filter:drop-shadow(0 0 5px #ffe5a2)}
.shop-categories{position:absolute;left:calc(7 * var(--su));top:calc(209 * var(--su));display:grid;gap:calc(8 * var(--su));z-index:2}
.shop-categories button{display:grid;place-items:center;width:calc(110 * var(--su));height:calc(78 * var(--su));padding:calc(8 * var(--su)) calc(23 * var(--su));border:0;border-radius:45px 0 0 45px;background:#edae00;box-shadow:0 3px 9px #754c2620}
.shop-categories button.active{width:calc(126 * var(--su));margin-left:calc(-16 * var(--su));background:#f6f6e5}
.shop-categories .crop-icon{width:100%;height:100%}
.shop-art-layout .shop-main{position:relative;min-height:0;display:flex;flex-direction:column;overflow:visible;z-index:2}
.shop-art-layout .shop-list{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));flex:1;min-height:0;gap:calc(16 * var(--su)) calc(18 * var(--su));padding:calc(39 * var(--su)) calc(38 * var(--su)) calc(44 * var(--su));background:url("../assets/ui-user/shop-list.png") center / 100% 100% no-repeat;overflow:visible}
.shop-art-layout .shop-item,.shop-art-layout .shop-item.active{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:0;gap:0;padding:calc(3 * var(--su));border:0;border-radius:22px;background:none;box-shadow:none;color:#876865}
.shop-art-layout .shop-item .crop-art{position:relative;display:grid;place-items:center;flex-shrink:0;width:calc(106 * var(--su));height:calc(106 * var(--su));max-width:100%;background:url("../assets/ui-user/shop-item-bg.png") center / contain no-repeat}
.shop-art-layout .shop-item .crop-art>.crop-icon{width:92%;height:96%;object-fit:contain}
.shop-art-layout .shop-item.active .crop-art{filter:drop-shadow(0 0 2px #edb121);border-radius:50%;outline:calc(3 * var(--su)) solid #f3b528;outline-offset:calc(-5 * var(--su))}
.shop-art-layout .shop-item.sold-out .crop-art{filter:grayscale(.6);opacity:.55}
.shop-art-layout .shop-copy{display:block;width:100%;text-align:center}
.shop-art-layout .shop-copy strong{display:block;font-size:calc(17.25 * var(--su));line-height:1.2;font-weight:900;white-space:nowrap;letter-spacing:-.025em}
.shop-art-layout .shop-copy small{display:flex;align-items:center;justify-content:center;gap:calc(3 * var(--su));margin:calc(5 * var(--su)) 0 0;font-size:calc(15 * var(--su));line-height:1.1;color:#658c7c;font-weight:800}
.shop-art-layout .clock-icon{font-style:normal;font-size:1.2em;line-height:1}
.shop-art-layout .card-price{position:absolute;left:calc(1 * var(--su));top:calc(4 * var(--su));display:flex;align-items:center;gap:calc(2 * var(--su));min-width:calc(53 * var(--su));height:calc(25 * var(--su));padding:0 calc(5 * var(--su)) 0 0;border-radius:16px;background:#ffd150;font-size:calc(16 * var(--su));line-height:1;box-shadow:0 2px 3px #6b643c28;z-index:2}
.shop-art-layout .card-price .crop-icon{width:calc(26 * var(--su));height:calc(26 * var(--su))}
.shop-art-layout .stock-time{position:absolute;right:calc(5 * var(--su));bottom:calc(-30 * var(--su));margin:0;padding:calc(9 * var(--su)) calc(15 * var(--su));border-radius:28px;background:#cff0dd;box-shadow:0 3px 7px #7e816934;color:#658b7c;font-size:calc(18 * var(--su));font-weight:800;white-space:nowrap}
.shop-art-layout .shop-detail{position:relative;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;min-width:0;min-height:0;padding:0 calc(14 * var(--su));border:0;border-radius:0;background:none;z-index:2}
.shop-art-layout .shop-detail::before{content:"";position:absolute;inset:calc(126 * var(--su)) calc(-9 * var(--su)) calc(-17 * var(--su));z-index:-1;background:url("../assets/ui-user/shop-detail.png") center / 100% 100% no-repeat;pointer-events:none}
.shop-selected-preview{position:relative;width:100%;flex-shrink:0;height:calc(180 * var(--su));margin-top:calc(-25 * var(--su))}
.shop-art-layout .shop-detail .detail-art{position:absolute;left:50%;top:0;transform:translateX(-50%);width:calc(204 * var(--su));height:calc(204 * var(--su));margin:0;background:url("../assets/ui-user/shop-preview-bg.png") center / contain no-repeat}
.shop-art-layout .shop-detail .detail-art>.crop-icon{width:81%;height:86%;padding-bottom:calc(12 * var(--su))}
.shop-art-layout .quantity-control{position:absolute;inset:0;width:auto;height:auto;margin:0;display:block;pointer-events:none}
.shop-art-layout .quantity-control input{position:absolute;left:calc(8 * var(--su));top:0;z-index:3;width:calc(61 * var(--su));height:calc(61 * var(--su));min-width:0;min-height:0;border:0;border-radius:50%;background:#ffae0a;color:#876865;font-size:calc(39 * var(--su));font-weight:900;line-height:1;text-align:center;appearance:textfield;pointer-events:auto;box-shadow:0 3px 7px #8b733926}
.shop-art-layout .quantity-control button{position:absolute;top:calc(67 * var(--su));width:calc(44 * var(--su));height:calc(50 * var(--su));min-width:36px;min-height:36px;border:0;border-radius:0;padding:0;background: url("../assets/ui-user/shop-arrow-left.png") center / contain no-repeat;pointer-events:auto}
.shop-art-layout .quantity-control button[data-delta="-1"]{left:calc(-25 * var(--su))}
.shop-art-layout .quantity-control button[data-delta="1"]{right:calc(-25 * var(--su));background-image:url("../assets/ui-user/shop-arrow-right.png")}
.shop-art-layout .shop-detail .detail-name{position:relative;flex-shrink:0;z-index:2;max-width:100%;margin:calc(-6 * var(--su)) 0 calc(12 * var(--su));padding:calc(8 * var(--su)) calc(19 * var(--su));border-radius:40px;background:#688b7b;color:#f8f5dc;text-align:center;white-space:nowrap;font-size:calc(24.3 * var(--su));font-weight:900;line-height:1.2}
.shop-art-layout .detail-facts{width:100%;margin:0;padding:0 calc(11 * var(--su));font-size:calc(16 * var(--su));font-weight:800;flex:1;display:flex;flex-direction:column;justify-content:space-around}
.shop-art-layout .detail-facts>div{display:flex;justify-content:space-between;align-items:center;gap:calc(8 * var(--su));min-height:calc(39 * var(--su));padding:calc(6 * var(--su)) 0;border:0;border-bottom:calc(6 * var(--su)) solid #d0f0da;border-radius:3px}
.shop-art-layout .detail-facts span{gap:calc(3 * var(--su));color:#658b7b}
.shop-art-layout .detail-facts strong{color:#876865;white-space:nowrap}
.shop-checkout{position:relative;display:flex;align-items:center;width:100%;min-height:calc(77 * var(--su));margin-top:calc(16 * var(--su));padding-right:calc(39 * var(--su));flex-shrink:0}
.shop-art-layout .detail-total{display:flex;justify-content:flex-start;align-items:center;gap:calc(8 * var(--su));width:100%;min-height:calc(44 * var(--su));margin:0;padding:calc(7 * var(--su)) calc(12 * var(--su));border:0;border-radius:32px;background:#688b7b;color:#eddda3;font-size:calc(25 * var(--su));font-weight:900;white-space:nowrap}
.shop-art-layout .detail-total strong{display:flex;align-items:center;gap:calc(2 * var(--su));font-size:calc(16 * var(--su));font-weight:800}
.shop-art-layout .detail-total .crop-icon{width:calc(25 * var(--su));height:calc(25 * var(--su))}
.shop-cart-button{position:absolute;right:calc(-5 * var(--su));top:0;display:grid;place-items:center;width:calc(81 * var(--su));height:calc(81 * var(--su));padding:calc(18 * var(--su));border:0;border-radius:50%;background:#f7f6e5;box-shadow:0 5px 13px #5e755d3a}
.shop-cart-button>.crop-icon{width:100%;height:100%}
.shop-art-layout .crop-art,.shop-art-layout .detail-art,.shop-categories button,.shop-cart-button{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.shop-art-layout .crop-art>.crop-icon,.shop-art-layout .detail-art>.crop-icon,.shop-categories .crop-icon,.shop-cart-button>.crop-icon{min-width:0;min-height:0;max-width:100%;max-height:100%;justify-self:center;align-self:center}
.shop-art-layout .detail-footnote{width:100%;margin-top:calc(-1 * var(--su));font-size:calc(11 * var(--su));color:#587762;font-weight:500;text-align:center;line-height:1.3}
.shop-wallet{position:absolute;bottom:0;left:0;z-index:3;min-width:calc(205 * var(--su));padding:calc(19 * var(--su)) calc(29 * var(--su)) calc(20 * var(--su)) calc(20 * var(--su));border-radius:0 60px 0 0;background:#fffef0}
.shop-wallet>span{display:flex;align-items:center;justify-content:space-between;gap:calc(20 * var(--su));padding:calc(5 * var(--su)) calc(16 * var(--su)) calc(5 * var(--su)) calc(6 * var(--su));border-radius:40px;background:#75cdb4;font-size:calc(30 * var(--su));font-weight:900}
.shop-wallet .crop-icon{width:calc(40 * var(--su));height:calc(40 * var(--su))}
html[lang="en"] .shop-art-layout .shop-copy strong{font-size:calc(12.75 * var(--su));white-space:normal}
html[lang="en"] .shop-art-layout .detail-name{font-size:calc(19.8 * var(--su))}
html[lang="en"] .shop-art-layout .detail-total{font-size:calc(22 * var(--su))}
html[lang="en"] .shop-art-layout .detail-facts{font-size:calc(14 * var(--su))}
/* Portrait phones retain the same layers, with scrolling rather than tiny text. */
@media(max-width:600px){
  #panel-overlay:has(#game-window[data-panel="shop"]){padding:12px 9px;background:#183b2370}
  #game-window[data-panel="shop"]{--su:1px;width:100%;height:94dvh;max-width:100%;max-height:94dvh;background-size:100% calc(100% - 22px)}
  #game-window[data-panel="shop"] #panel-content{padding:0 12px 0 18px;scrollbar-width:thin}
  #game-window[data-panel="shop"] #panel-close{right:-2px;top:53px;width:44px;height:44px;border:6px solid #b9683e;border-radius:16px;background-size:58%;z-index:5}
  .shop-art-layout.shop-layout{height:auto;min-height:100%;display:flex;flex-direction:column;gap:15px;padding:112px 8px 91px 26px}
  .shop-trade-tabs{top:-5px;left:-10px;height:100px}
  .shop-trade-tab{width:136px;height:91px;padding:16px;font-size:29px}
  .shop-trade-tab.active{width:151px;height:101px}
  .shop-trade-tab+.shop-trade-tab{margin-left:-19px;margin-top:-9px}
  .shop-trade-tab>span{padding:8px}
  .shop-categories{left:-12px;top:132px;gap:8px}
  .shop-categories button,.shop-categories button.active{width:52px;height:49px;margin:0;padding:8px 10px;border-radius:25px 0 0 25px}
  .shop-art-layout .shop-list{flex:none;grid-template-rows:repeat(2,132px);gap:8px 4px;padding:24px 15px 28px;background-size:100% 100%}
  .shop-art-layout .shop-item,.shop-art-layout .shop-item.active{padding:0;gap:1px}
  .shop-art-layout .shop-item .crop-art{width:69px;height:77px}
  .shop-art-layout .shop-copy strong{font-size:10.5px;white-space:normal;line-height:1.25;letter-spacing:-.04em}
  .shop-art-layout .shop-copy small{font-size:12px;margin-top:4px}
  .shop-art-layout .card-price{left:0;top:1px;height:20px;min-width:40px;font-size:12px;padding-right:5px;gap:0}
  .shop-art-layout .card-price .crop-icon{width:21px;height:21px}
  .shop-art-layout .stock-time{position:static;align-self:flex-end;margin:-8px 9px 0 0;padding:7px 11px;font-size:13px;z-index:1}
  .shop-art-layout .shop-detail{display:flex;min-height:425px;align-self:stretch;padding:0 22px;gap:0;border:0;background:none;border-radius:0}
  .shop-art-layout .shop-detail::before{inset:90px -2px -2px}
  .shop-selected-preview{height:151px;margin-top:0}
  .shop-art-layout .shop-detail .detail-art{width:165px;height:165px}
  .shop-art-layout .quantity-control input{width:50px;height:50px;font-size:31px;left:14px;top:0}
  .shop-art-layout .quantity-control button{top:54px;width:42px;height:44px}
  .shop-art-layout .quantity-control button[data-delta="-1"]{left:-15px}
  .shop-art-layout .quantity-control button[data-delta="1"]{right:-15px}
  .shop-art-layout .shop-detail .detail-name{font-size:21.6px;margin:-7px 0 8px;padding:8px 18px}
  .shop-art-layout .detail-facts{font-size:15px;padding:0 8px;gap:9px}
  .shop-art-layout .detail-facts>div{min-height:31px;padding:4px 0;border-bottom-width:5px}
  .shop-checkout{min-height:71px;margin-top:15px;padding-right:28px}
  .shop-art-layout .detail-total{min-height:43px;padding:8px 12px;font-size:23px;gap:8px}
  .shop-art-layout .detail-total strong{font-size:15px}
  .shop-art-layout .detail-total .crop-icon{width:24px;height:24px}
  .shop-cart-button{width:71px;height:71px;padding:17px;right:-6px}
  .shop-art-layout .detail-footnote{font-size:11px;margin:0 0 15px}
  .shop-wallet{bottom:0;left:-18px;min-width:170px;padding:12px 20px 12px 14px;border-radius:0 42px 0 0}
  .shop-wallet>span{font-size:25px;gap:16px;padding:4px 12px 4px 5px}
  .shop-wallet .crop-icon{width:33px;height:33px}
  html[lang="en"] .shop-art-layout .shop-copy strong{font-size:9px}
  html[lang="en"] .shop-art-layout .detail-name{font-size:18.9px}
}
/* Landscape phones use two columns and an independently scrollable window. */
@media(min-width:601px) and (max-height:550px){
  #panel-overlay:has(#game-window[data-panel="shop"]){padding:4px 22px}
  #game-window[data-panel="shop"]{--su:.72px;width:min(800px,95vw);height:96dvh;max-height:96dvh;background-size:100% calc(100% - 12px)}
  #game-window[data-panel="shop"] #panel-close{top:75px;right:-8px;width:44px;height:44px;min-width:44px;min-height:44px;border-width:6px;border-radius:15px}
  .shop-art-layout.shop-layout{height:auto;min-height:100%;padding:98px 44px 56px 65px;gap:19px}
  .shop-trade-tabs{top:-9px;left:7px}
  .shop-categories{left:2px;top:130px}
  .shop-art-layout .shop-list{grid-template-rows:repeat(2,124px);gap:5px 7px;padding:22px 22px 28px}
  .shop-art-layout .shop-copy strong{font-size:11.25px;white-space:normal}
  .shop-art-layout .shop-copy small{font-size:12px}
  .shop-art-layout .card-price{font-size:12px;min-width:39px;top:2px}
  .shop-art-layout .shop-detail{min-height:311px;padding:0 7px}
  .shop-art-layout .detail-facts{font-size:12px;padding:0 8px;gap:8px}
  .shop-art-layout .shop-detail .detail-name{font-size:17.1px}
  .shop-art-layout .stock-time{font-size:13px;bottom:-26px}
  .shop-art-layout .detail-total{font-size:19px;padding-right:22px;gap:6px}
  .shop-art-layout .detail-total strong{font-size:12px}
  .shop-art-layout .detail-footnote{font-size:10px;margin-top:3px}
  html[lang="en"] .shop-art-layout .shop-copy strong{font-size:9.75px}
}
/* The shop occupies the complete game surface while either trading tab is open. */
#app:has(#game-window[data-panel="shop"]) :is(.game-hud,.quest-board,.quickbar,.game-actions,#movement-help,#touch-controls,.station-marker,#station-prompt){visibility:hidden;pointer-events:none}
.shop-art-layout .shop-copy .clock-icon .crop-icon{width:1.05em;height:1.05em}
.shop-art-layout .detail-facts span>.crop-icon{width:1.12em;height:1.12em}
/* Match the supplied 1920 × 1080 composition without a desktop scale cap. */
@media(min-width:601px) and (min-height:551px){
  #panel-overlay:has(#game-window[data-panel="shop"]){padding:0;background:#102e171c;backdrop-filter:blur(5px);overflow:hidden}
  #game-window[data-panel="shop"]{--su:min(.0520833333vw,.0925925926dvh);width:calc(1920 * var(--su));height:calc(1080 * var(--su));max-width:100vw;max-height:100dvh;background-size:calc(1723 * var(--su)) calc(1013 * var(--su));background-position:calc(97 * var(--su)) calc(67 * var(--su));border-radius:0;overflow:visible}
  #game-window[data-panel="shop"] #panel-content{overflow:hidden;padding:0}
  #game-window[data-panel="shop"] #panel-close{right:calc(43 * var(--su));top:calc(302 * var(--su));width:calc(191 * var(--su));height:calc(163 * var(--su));min-width:0;min-height:0;border:0;border-radius:0;background-image:url("../assets/ui-user/shop-close.png"),url("../assets/ui-user/shop-close-circle.png"),url("../assets/ui-user/shop-close-bg.png");background-size:calc(58 * var(--su)) calc(58 * var(--su)),calc(122 * var(--su)) calc(122 * var(--su)),100% 100%;background-position:calc(88 * var(--su)) center,calc(55 * var(--su)) center,center;background-repeat:no-repeat;box-shadow:none}
  .shop-art-layout.shop-layout{display:block;padding:0;width:100%;height:100%;min-height:0}
  .shop-trade-tabs{position:absolute;left:0;top:0;width:calc(900 * var(--su));height:calc(303 * var(--su));display:block;z-index:5}
  .shop-trade-tab,.shop-trade-tab.active{position:absolute;display:block;border:0;border-radius:0;padding:0;margin:0;transform:none;box-shadow:none;background-repeat:no-repeat;background-size:100% 100%;font-size:calc(98 * var(--su));font-weight:900;letter-spacing:.04em;line-height:1}
  .shop-trade-tab[data-mode="buy"]{left:calc(61 * var(--su));top:0;width:calc(536 * var(--su));height:calc(302 * var(--su));background-image:url("../assets/ui-user/shop-buy-tab.png");z-index:2}
  .shop-trade-tab[data-mode="sell"]{left:calc(408 * var(--su));top:calc(-90 * var(--su));width:calc(446 * var(--su));height:calc(223 * var(--su));margin:0;background-image:url("../assets/ui-user/shop-sell-tab.png");z-index:1}
  .shop-trade-tab[data-mode="sell"].active{z-index:4;top:calc(-38 * var(--su))}
  .shop-trade-tab>span,.shop-trade-tab.active>span{position:absolute;display:grid;place-items:center;padding:0;line-height:1;background-size:100% 100%;text-shadow:0 calc(5 * var(--su)) calc(8 * var(--su)) #56723a55}
  .shop-trade-tab[data-mode="buy"]>span{left:calc(113 * var(--su));top:calc(22 * var(--su));width:calc(263 * var(--su));height:calc(182 * var(--su));background-image:url("../assets/ui-user/shop-buy-label-bg.png")}
  .shop-trade-tab[data-mode="sell"]>span{left:calc(105 * var(--su));top:calc(48 * var(--su));width:calc(261 * var(--su));height:calc(171 * var(--su));background-image:url("../assets/ui-user/shop-sell-label-bg.png")}
  .shop-trade-tab>span>b{font-weight:900;display:block}
  .shop-trade-tab[data-mode="buy"]>span>b{transform:rotate(12deg)}
  .shop-trade-tab[data-mode="sell"]>span>b{transform:rotate(-15deg)}
  .shop-trade-tab:active:not(:disabled),.shop-trade-tab.active:active:not(:disabled){transform:translateY(calc(2 * var(--su)))}
  .shop-categories{left:calc(48 * var(--su));top:calc(355 * var(--su));gap:calc(6 * var(--su));z-index:1}
  .shop-categories button,.shop-categories button.active{position:relative;width:calc(369 * var(--su));height:calc(145 * var(--su));min-width:0;min-height:0;margin:0;padding:0;border:0;border-radius:0;background: url("../assets/ui-user/shop-category-selected.png") center / calc(369 * var(--su)) calc(225 * var(--su)) no-repeat;box-shadow:none;display:block}
  .shop-categories button.active{height:calc(179 * var(--su));background-image:url("../assets/ui-user/shop-category-bg.png")}
  .shop-categories button.active>.crop-icon{position:absolute;left:calc(82 * var(--su));top:calc(21 * var(--su));width:calc(117 * var(--su));height:calc(117 * var(--su))}
  .shop-categories button:not(.active)>.crop-icon{position:absolute;left:calc(166 * var(--su));top:calc(14 * var(--su));width:calc(58 * var(--su));height:calc(97 * var(--su))}
  .shop-art-layout .shop-main{position:absolute;left:calc(226 * var(--su));top:calc(253 * var(--su));width:calc(1001 * var(--su));height:calc(747 * var(--su));z-index:2}
  .shop-art-layout .shop-list{width:100%;height:100%;flex:none;grid-template-columns:repeat(3,calc(230 * var(--su)));grid-template-rows:repeat(2,calc(244 * var(--su)));gap:calc(15 * var(--su)) calc(28 * var(--su));padding:calc(122 * var(--su)) calc(139 * var(--su)) calc(122 * var(--su)) calc(90 * var(--su));background-size:100% 100%;overflow:visible}
  .shop-art-layout .shop-item,.shop-art-layout .shop-item.active{justify-content:flex-start;gap:0;padding:0;border-radius:0;overflow:visible}
  .shop-art-layout .shop-item .crop-art{width:calc(165 * var(--su));height:calc(165 * var(--su));max-width:none}
  .shop-art-layout .shop-item .crop-art>.crop-icon{width:100%;height:100%}
  .shop-art-layout .shop-item.active .crop-art{outline:0;filter:none}
  .shop-art-layout .shop-copy strong{font-size:calc(28.5 * var(--su));line-height:1.18;font-weight:900;letter-spacing:-.04em}
  .shop-art-layout .shop-copy small{font-size:calc(28 * var(--su));line-height:1.15;margin-top:calc(9 * var(--su));gap:calc(6 * var(--su))}
  .shop-art-layout .card-price{left:calc(16 * var(--su));top:0;height:calc(40 * var(--su));min-width:calc(85 * var(--su));padding-right:calc(8 * var(--su));gap:calc(1 * var(--su));border-radius:30px;font-size:calc(27 * var(--su))}
  .shop-art-layout .card-price .crop-icon{width:calc(40 * var(--su));height:calc(40 * var(--su))}
  .shop-art-layout .stock-time{right:calc(71 * var(--su));bottom:calc(-31 * var(--su));padding:calc(15 * var(--su)) calc(20 * var(--su));font-size:calc(32 * var(--su));line-height:1.05;min-height:calc(65 * var(--su));border-radius:50px}
  .shop-art-layout .shop-detail{position:absolute;left:calc(1186 * var(--su));top:calc(246 * var(--su));width:calc(515 * var(--su));height:calc(830 * var(--su));padding:0;display:block;z-index:2}
  .shop-art-layout .shop-detail::before{inset:calc(164 * var(--su)) 0 0;background-size:100% 100%}
  .shop-selected-preview{position:absolute;left:0;top:0;width:100%;height:calc(350 * var(--su));margin:0}
  .shop-art-layout .shop-detail .detail-art{width:calc(350 * var(--su));height:calc(350 * var(--su));margin:0;background-size:100% 100%}
  .shop-art-layout .shop-detail .detail-art>.crop-icon{width:80%;height:87%;padding-bottom:calc(10 * var(--su))}
  .shop-art-layout .quantity-control input{left:calc(107 * var(--su));top:calc(7 * var(--su));width:calc(103 * var(--su));height:calc(103 * var(--su));font-size:calc(65 * var(--su));box-shadow:0 3px 9px #8b733926}
  .shop-art-layout .quantity-control button{top:calc(100 * var(--su));width:calc(100 * var(--su));height:calc(104 * var(--su));min-width:0;min-height:0}
  .shop-art-layout .quantity-control button[data-delta="-1"]{left:calc(8 * var(--su))}
  .shop-art-layout .quantity-control button[data-delta="1"]{right:calc(16 * var(--su))}
  .shop-art-layout .shop-detail .detail-name{position:absolute;left:calc(115 * var(--su));top:calc(243 * var(--su));width:calc(286 * var(--su));height:calc(95 * var(--su));max-width:none;margin:0;padding:calc(17 * var(--su)) calc(12 * var(--su));border-radius:60px;font-size:calc(43.2 * var(--su));line-height:1.25;font-weight:900;text-align:center;letter-spacing:-.04em;background-image:url("../assets/ui-user/shop-product-title.png");background-size:100% 100%}
  .shop-art-layout .detail-facts{position:absolute;left:calc(114 * var(--su));top:calc(370 * var(--su));width:calc(279 * var(--su));height:calc(252 * var(--su));padding:0;margin:0;display:flex;flex-direction:column;justify-content:space-between;font-size:calc(26 * var(--su))}
  .shop-art-layout .detail-facts>div{min-height:calc(70 * var(--su));padding:calc(12 * var(--su)) calc(4 * var(--su)) calc(6 * var(--su));gap:calc(8 * var(--su));border-bottom:calc(11 * var(--su)) solid #d0f0da;border-radius:6px}
  .shop-art-layout .detail-facts span{gap:calc(8 * var(--su));white-space:nowrap}
  .shop-art-layout .detail-facts>div:last-child>span{padding-left:calc(42 * var(--su))}
  .shop-checkout{position:absolute;left:calc(111 * var(--su));top:calc(638 * var(--su));width:calc(390 * var(--su));min-height:0;height:calc(150 * var(--su));padding:0;margin:0;display:block}
  .shop-art-layout .detail-total{position:absolute;left:0;top:calc(38 * var(--su));width:calc(286 * var(--su));height:calc(71 * var(--su));min-height:0;padding:calc(7 * var(--su)) calc(22 * var(--su));border-radius:45px;font-size:calc(52 * var(--su));line-height:1;gap:calc(10 * var(--su));background-image:url("../assets/ui-user/shop-total-bg.png");background-size:100% 100%}
  .shop-art-layout .detail-total strong{font-size:calc(26 * var(--su));gap:calc(3 * var(--su))}
  .shop-art-layout .detail-total .crop-icon{width:calc(37 * var(--su));height:calc(37 * var(--su))}
  .shop-cart-button{left:calc(233 * var(--su));right:auto;top:0;width:calc(150 * var(--su));height:calc(150 * var(--su));padding:calc(32 * var(--su));background:#f7f6e5;border-radius:50%;box-shadow:0 6px 18px #5e755d3a}
  .shop-art-layout .detail-footnote{position:absolute;left:calc(76 * var(--su));top:calc(790 * var(--su));width:calc(363 * var(--su));margin:0;font-size:calc(15 * var(--su));opacity:.85}
  .shop-wallet{left:0;bottom:0;min-width:0;width:calc(343 * var(--su));height:calc(156 * var(--su));padding:calc(40 * var(--su)) calc(55 * var(--su)) calc(32 * var(--su)) calc(35 * var(--su));border-radius:0 calc(100 * var(--su)) 0 0;background:#fffef0}
  .shop-wallet>span{width:calc(253 * var(--su));height:calc(84 * var(--su));padding:calc(5 * var(--su)) calc(27 * var(--su)) calc(5 * var(--su)) calc(10 * var(--su));gap:calc(27 * var(--su));font-size:calc(50 * var(--su));line-height:1;border-radius:60px}
  .shop-wallet .crop-icon{width:calc(70 * var(--su));height:calc(70 * var(--su))}
  html[lang="en"] .shop-trade-tab{font-size:calc(76 * var(--su));letter-spacing:0}
  html[lang="en"] .shop-art-layout .shop-copy strong{font-size:calc(21.75 * var(--su))}
  html[lang="en"] .shop-art-layout .detail-name{font-size:calc(32.4 * var(--su))}
  html[lang="en"] .shop-art-layout .detail-facts{font-size:calc(21 * var(--su))}
  html[lang="en"] .shop-art-layout .detail-total{font-size:calc(40 * var(--su))}
}
@media(min-width:601px) and (min-height:551px){
  #game-window[data-panel="shop"] #panel-close{background-color:transparent}
  .shop-art-layout .shop-copy{margin-top:calc(-14 * var(--su))}
  .shop-art-layout .shop-copy .clock-icon{font-size:1em}
  .shop-art-layout .shop-detail .detail-art>.crop-icon{width:74%;height:83%;padding-bottom:0;transform:translateY(calc(10 * var(--su)))}
  .shop-categories button.active{background-position:center calc(50% + 22 * var(--su))}
  .shop-categories button:not(.active){margin-left:calc(79 * var(--su));transform:translateY(calc(-16 * var(--su)))}
  .shop-categories button:not(.active)>.crop-icon{left:calc(87 * var(--su))}
}

.potion-showcase{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:24px!important;min-width:0}
.potion-aura{position:relative;isolation:isolate;width:min(240px,22vw);aspect-ratio:1;display:grid;place-items:center;flex-shrink:0}
.potion-rays,.potion-halo{position:absolute;inset:0;border-radius:50%;pointer-events:none}
.potion-rays{background:repeating-conic-gradient(from 0deg,#f5cf6180 0deg 12deg,transparent 12deg 30deg);mask-image:radial-gradient(circle,#000 10%,transparent 70%);animation:potionRotate 12s linear infinite}
.potion-halo{inset:10%;background:radial-gradient(circle,#ffe594b0,transparent 70%);animation:potionPulse 2s ease-in-out infinite alternate}
.potion-bottle{position:relative;z-index:2;width:52%;height:70%;display:grid;place-items:center;filter:hue-rotate(var(--potion-hue)) drop-shadow(0 4px 7px #608a5944)}
.potion-bottle .crop-icon{width:100%;height:100%;object-fit:contain}
.potion-spark{position:absolute;left:calc(12% + mod(var(--i)*23,78)*1%);top:75%;width:5px;height:5px;border-radius:50%;background:#eabe40;box-shadow:0 0 8px #ffcf36;animation:potionSpark 2.8s linear infinite;animation-delay:calc(var(--i)*-.29s)}
.potion-showcase h2{margin:0;color:#668875;font-size:24px}.potion-level{color:#b58a35}.potion-description{max-width:400px;line-height:1.65;margin:0}.potion-showcase small{color:#92a292}
.potion-detail{justify-content:center;gap:18px!important;padding:22px!important;min-width:0}
.potion-detail h2{font-size:21px;margin:0}.potion-probabilities{display:flex;width:100%;height:24px;overflow:hidden;border-radius:12px;background:#e8ecdc}.potion-probabilities span{height:100%;flex-shrink:0}
.potion-legend{display:grid;grid-template-columns:1fr 1fr;gap:12px 8px;font-size:13px}.potion-legend>span{display:flex;gap:5px;align-items:center}.potion-legend i{width:9px;height:9px;border-radius:50%;flex-shrink:0}.potion-legend b{margin-left:auto}
.potion-mutation{display:flex;flex-direction:column;gap:10px;padding:16px 0;border-top:1px solid #d6dec8;border-bottom:1px solid #d6dec8}.potion-mutation strong{font-size:22px;color:#b38c37}.potion-detail p{font-size:13px;line-height:1.6}.potion-purchase{min-height:44px;width:100%}
@keyframes potionRotate{to{transform:rotate(360deg)}}@keyframes potionPulse{from{opacity:.4;transform:scale(.85)}to{opacity:1;transform:scale(1.1)}}@keyframes potionSpark{0%{opacity:0;transform:translateY(0) scale(.3)}25%{opacity:1}100%{opacity:0;transform:translateY(-130px) scale(1)}}
@media(prefers-reduced-motion:reduce){.potion-rays,.potion-halo,.potion-spark{animation:none}.potion-spark{display:none}}
@media(max-width:600px){.potion-aura{width:140px}.potion-showcase{padding:12px!important;gap:8px}.potion-detail{padding:14px!important;gap:12px!important}.potion-description{font-size:13px}.potion-showcase h2{font-size:20px}}
@media(max-height:550px) and (min-width:601px){.potion-aura{width:120px}.potion-showcase{gap:6px;padding:10px!important}.potion-showcase h2{font-size:18px}.potion-description{font-size:12px}.potion-detail{gap:8px!important;padding:12px!important}.potion-detail h2{font-size:16px}.potion-mutation{padding:8px 0;gap:4px}.potion-legend{gap:6px}.potion-probabilities{height:18px}}

.shop-categories{z-index:4}
.potion-art-layout .potion-detail{justify-content:center;align-items:stretch}
.potion-art-layout .potion-detail::before{inset:0;background:#edf3df;border-radius:20px}
.potion-legend,.potion-mutation{width:100%}

/* The potion preview is a separate, deliberately simple two-column page. */
#game-window[data-trade="potion"]{width:min(1050px,94vw);height:min(720px,94dvh);background:#fffbea;border-radius:24px;overflow:hidden}
#game-window[data-trade="potion"] .window-header{position:relative;inset:auto;height:64px;min-height:64px;padding:12px 24px;pointer-events:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #d7dfc8}
#game-window[data-trade="potion"] .window-header>div{position:static;width:auto;height:auto;overflow:visible;clip-path:none}
#game-window[data-trade="potion"] .window-header h1{font-size:24px}
#game-window[data-trade="potion"] #panel-close{position:static;width:40px;height:40px;min-width:40px;min-height:40px;border:0;border-radius:12px;background:#e8efda;font-size:28px;color:#668875}
#game-window[data-trade="potion"] #panel-content{flex:1;min-height:0;overflow:auto}
.potion-art-layout.shop-layout{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);padding:76px 24px 24px;gap:24px;height:auto;min-height:100%}
.potion-art-layout .shop-trade-tabs{display:none}
.potion-art-layout .shop-categories{left:24px;top:12px;display:flex;gap:10px}
.potion-art-layout .shop-categories button,.potion-art-layout .shop-categories button.active{width:52px;height:44px;margin:0;padding:6px;border-radius:12px;background:#dcead5}
.potion-art-layout .shop-categories button.active{background:#efcc72}
.potion-art-layout .shop-wallet{position:absolute;inset:12px 24px auto auto;width:auto;height:44px;min-width:0;padding:6px 12px;background:#dcead5;border-radius:22px;transform:none;font-size:20px}
.potion-art-layout .shop-wallet strong{font-size:20px}.potion-art-layout .shop-wallet .crop-icon{width:28px;height:28px}
.potion-art-layout .potion-detail .detail-total{position:static;inset:auto;transform:none;width:100%;height:auto;min-height:40px;padding:8px 14px;font-size:20px;background:#668875}
.potion-art-layout .potion-detail .detail-total strong{font-size:20px}.potion-art-layout .detail-total .crop-icon{width:24px;height:24px}
@media(max-width:600px){.potion-art-layout.shop-layout{grid-template-columns:1fr;padding:70px 12px 16px;gap:16px}.potion-art-layout .shop-categories{left:12px}.potion-art-layout .shop-wallet{right:12px}.potion-showcase{justify-content:flex-start!important}}
@media(max-height:550px) and (min-width:601px){
 #game-window[data-trade="potion"] .window-header{height:48px;min-height:48px;padding:4px 16px}
 .potion-art-layout.shop-layout{padding:52px 14px 10px;gap:14px}
 .potion-art-layout .shop-wallet,.potion-art-layout .shop-categories{top:5px}
 .potion-art-layout .shop-categories button,.potion-art-layout .shop-categories button.active{height:36px}
 .potion-art-layout .shop-wallet{height:36px}
 .potion-art-layout .potion-detail{gap:7px!important;padding:10px!important}
 .potion-art-layout .potion-detail>p{display:none}.potion-art-layout .potion-detail h2{font-size:16px}
 .potion-art-layout .potion-mutation{flex-direction:row;align-items:center;justify-content:space-between;padding:8px 0;font-size:12px}
 .potion-art-layout .potion-mutation strong{font-size:18px}
 .potion-art-layout .potion-detail .detail-total{min-height:32px;padding:4px 12px;font-size:16px}
 .potion-art-layout .potion-purchase{min-height:34px;padding:6px 10px;font-size:14px}
 .potion-aura{width:90px}.potion-showcase small{font-size:10px}
}

.potion-art-layout.shop-layout{display:grid}
.potion-art-layout .shop-main,.potion-art-layout .shop-detail{position:relative;inset:auto;width:auto;height:auto;min-height:0}
.potion-art-layout .shop-categories button.active>.crop-icon,.potion-art-layout .shop-categories button:not(.active)>.crop-icon{position:static;width:100%;height:100%}
.potion-art-layout .shop-wallet>span{width:auto;height:auto;padding:0;gap:8px;background:none;font-size:20px}
@media(max-height:550px) and (min-width:601px){.potion-art-layout .potion-detail{gap:5px!important}.potion-art-layout .potion-mutation{padding:6px 0}.potion-art-layout .potion-detail .detail-total{min-height:28px}.potion-art-layout .potion-purchase{min-height:32px}}

.buy-art-layout .shop-item[data-category="exotic"] .crop-art{filter:drop-shadow(0 0 4px #b98bdb)}
.buy-art-layout .shop-copy .slot-purchase-count{font-size:clamp(10px,calc(22 * var(--su)),16px);white-space:nowrap}
.buy-art-layout .shop-copy strong{white-space:normal}
.buy-art-layout .detail-footnote{white-space:normal;line-height:1.4}

.buy-art-layout .shop-categories{pointer-events:none}
.buy-art-layout .shop-categories button{pointer-events:auto}

@media(min-width:601px) and (min-height:551px){
 .buy-art-layout .shop-categories{width:calc(178 * var(--su));gap:calc(12 * var(--su))}
 .buy-art-layout .shop-categories button,.buy-art-layout .shop-categories button.active{width:100%;height:calc(145 * var(--su));margin:0;transform:none;background-size:100% 100%}
 .buy-art-layout .shop-categories button.active>.crop-icon,.buy-art-layout .shop-categories button:not(.active)>.crop-icon{left:calc(34 * var(--su));top:calc(24 * var(--su));width:calc(90 * var(--su));height:calc(90 * var(--su))}
 .buy-art-layout .detail-facts{top:calc(350 * var(--su));height:calc(270 * var(--su));font-size:calc(23 * var(--su))}
 .buy-art-layout .detail-facts>div{min-height:0;flex:1;padding:calc(7 * var(--su)) 0}
 .buy-art-layout .detail-facts>div:last-child>span{padding-left:0}
 .buy-art-layout .detail-total{width:calc(230 * var(--su));height:calc(95 * var(--su));top:calc(28 * var(--su));flex-direction:column;justify-content:center;font-size:calc(27 * var(--su));gap:calc(5 * var(--su));padding:calc(6 * var(--su))}
 .buy-art-layout .detail-total strong{font-size:calc(27 * var(--su))}
 .buy-art-layout .shop-wallet{width:max-content;max-width:45%}
 .buy-art-layout .shop-wallet>span{width:auto;gap:12px;font-size:clamp(16px,calc(32 * var(--su)),28px)}
}
@media(max-width:600px){.buy-art-layout .shop-copy .slot-purchase-count{font-size:10px;letter-spacing:-.4px}}
@media(min-width:601px) and (max-height:550px){.buy-art-layout .shop-copy .slot-purchase-count{font-size:11px}}
/* Keep original placement; product names render above overlapping artwork. */
.buy-art-layout .shop-copy{position:relative;z-index:3}
.buy-art-layout .shop-detail .detail-name{z-index:3}
.potion-showcase>h2{position:relative;z-index:3}

/* Both item kinds share icon + name + right-aligned value rows. */
.detail-facts.item-facts>div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.detail-facts.item-facts .item-fact-label{display:flex;align-items:center;gap:6px;padding:0;min-width:0}
.detail-facts.item-facts .item-fact-label>img{width:clamp(22px,3dvh,32px);height:clamp(22px,3dvh,32px);object-fit:contain;flex:none}
.detail-facts.item-facts .item-fact-label>span{display:block;white-space:normal;line-height:1.3;color:inherit}
.detail-facts.item-facts>div:last-child>.item-fact-label{padding-left:0}
.detail-facts.item-facts strong{justify-content:flex-end;text-align:right}
@media(min-width:601px) and (min-height:551px){
 .buy-art-layout .detail-facts.item-facts{left:calc(65 * var(--su));width:calc(385 * var(--su));font-size:calc(22 * var(--su))}
}
#trade-warehouse-shortcut{z-index:70;visibility:visible;pointer-events:auto}
#trade-warehouse-shortcut[hidden]{display:none}

.buy-art-layout .shop-copy .slot-stock{font-size:clamp(10px,calc(18 * var(--su)),16px);line-height:1.15;margin-top:2px;color:#668c7b}
.selected-stock{position:absolute;right:8%;top:8%;z-index:3;padding:4px 9px;border-radius:18px;background:#fffce9e8;color:#658b7b;font-size:clamp(11px,calc(22 * var(--su)),18px);font-weight:800}

.buy-art-layout .crop-art>.crop-icon,.buy-art-layout .detail-art>.crop-icon,.potion-bottle>.crop-icon{scale:.75}

.shop-item.sold-out .slot-stock{color:#ad563a;font-weight:900}
.shop-cart-button .restock-button-label{font-size:clamp(12px,2dvh,20px);white-space:nowrap;color:#826a67}

.shop-price-hint{position:absolute;top:0;left:0;width:100%;margin:0;transform:translateY(-120%);text-align:center;font-size:clamp(10px,1.5dvh,14px);line-height:1.3;color:#826a67;font-weight:700;pointer-events:none}
@media(max-width:760px){.shop-price-hint{position:static;transform:none;margin:0 0 6px;flex-shrink:0}}

.shop-art-layout .shop-purchase-button{border:0;border-radius:24px;background:none;box-shadow:none;text-align:inherit;cursor:pointer}
.shop-purchase-button>.shop-cart-button{display:grid;place-items:center;pointer-events:none}
.shop-purchase-button:disabled{cursor:default;opacity:.5}.shop-purchase-button:focus-visible{outline:3px solid #ffb52d;outline-offset:3px}

/* One three-row catalog: basic seeds, exotic seeds, then the next potion. */
.unified-shop .shop-list{grid-template-rows:repeat(3,minmax(0,1fr));gap:8px;padding:22px 25px}
.unified-shop .shop-item .crop-art{width:clamp(50px,10dvh,92px);height:clamp(50px,10dvh,92px)}
.unified-shop .shop-copy small{margin-top:2px;font-size:11px}
.unified-potion-facts{overflow:auto;font-size:14px;line-height:1.4;color:#688875;min-height:0}
.unified-potion-facts p{margin:6px 0}.unified-potion-facts .potion-special{color:#a36a28}
.unified-potion-facts .potion-probabilities{display:flex;height:12px;border-radius:6px;overflow:hidden}
.unified-potion-facts .potion-legend{font-size:12px;gap:4px}.unified-potion-facts .potion-legend span{display:flex;justify-content:space-between;gap:5px}
.unified-potion-detail .detail-art .rarity-glow{animation:rarity-rays 10s linear infinite,rarity-breathe 2.8s ease-in-out infinite}
@media(min-width:601px) and (min-height:551px){
 .unified-shop .shop-list{grid-template-columns:repeat(3,minmax(0,1fr));padding:calc(60 * var(--su)) calc(65 * var(--su)) calc(35 * var(--su));gap:calc(16 * var(--su))}
 .unified-shop .shop-item .crop-art{width:calc(130 * var(--su));height:calc(130 * var(--su))}
 .unified-shop .shop-copy .slot-purchase-count,.unified-shop .shop-copy .slot-stock{font-size:clamp(10px,calc(18 * var(--su)),14px)}
 .unified-potion-facts{position:absolute;left:calc(65 * var(--su));top:calc(350 * var(--su));width:calc(385 * var(--su));height:calc(270 * var(--su));font-size:clamp(12px,calc(21 * var(--su)),17px)}
}
@media(max-width:600px){.unified-shop .shop-list{grid-template-rows:repeat(3,140px);height:auto}.unified-potion-facts{max-height:260px}}
@media(min-width:601px) and (max-height:550px){.unified-shop .shop-list{grid-template-rows:repeat(3,126px);height:auto}.unified-potion-facts{max-height:200px}}

.unified-potion-detail .potion-spark{pointer-events:none;background:var(--rarity-glow);box-shadow:0 0 7px var(--rarity-glow)}

.unified-shop [data-category=potion],.unified-shop .potion-offer-complete{grid-column:2}
.unified-shop .shop-list{background:none;isolation:isolate}
.unified-shop .shop-list::before{content:'';position:absolute;inset:0 0 -18px;background:url("../assets/ui-user/shop-list.png") center / 100% 100% no-repeat;z-index:-1;pointer-events:none}
.unified-shop .stock-time{position:absolute;top:0;bottom:auto;right:calc(20 * var(--su));margin:0;translate:0 -110%;z-index:3}
.shop-art-layout .shop-detail .detail-name{background:none!important;border:0;box-shadow:none;translate:0 6px}
.shop-art-layout .shop-wallet{position:fixed;left:0;bottom:0;right:auto;top:auto;z-index:8;margin:0;transform:none}

/* Separate tab artwork from hit targets so the frame never blocks tab clicks. */
#game-window[data-panel="shop"]{background:none}
.shop-art-layout::before{content:'';position:absolute;inset:0;background:url("../assets/ui-user/shop-frame.png") center bottom / 100% calc(100% - 35 * var(--su)) no-repeat;z-index:1;pointer-events:none}
.shop-art-layout .shop-trade-tabs-rear{z-index:0;pointer-events:none}
.shop-trade-tabs-rear .shop-trade-tab{pointer-events:none}
.shop-trade-tabs-rear .active{visibility:hidden}
.shop-art-layout .shop-trade-tabs-front{z-index:5;pointer-events:none}
.shop-trade-tabs-front .shop-trade-tab{pointer-events:auto}
.shop-trade-tabs-front .shop-trade-tab:not(.active){background:none;box-shadow:none;z-index:1}
.shop-trade-tabs-front .shop-trade-tab:not(.active)>span{visibility:hidden}
.shop-trade-tabs-front .trade-guide-hand{position:absolute;left:60%;top:80%;z-index:6;pointer-events:none;font:48px/1 sans-serif;filter:drop-shadow(0 3px 3px #49332188);animation:trade-guide-tap 1.2s ease-in-out infinite}
@keyframes trade-guide-tap{0%,100%{translate:0 12px;rotate:-12deg}50%{translate:0 0;rotate:0deg}}
body[data-reduced-motion=true] .trade-guide-hand{animation:none}
.shop-trade-tabs-front .shop-trade-tab.active{z-index:2}
.unified-shop{--potion-art-width:clamp(75px,15dvh,138px);--potion-art-height:clamp(75px,15dvh,138px)}
.unified-shop .shop-item[data-category=potion],.unified-shop .shop-item[data-category=potion]:active:not(:disabled){transform:none;height:100%;align-self:center}
.unified-shop .shop-item[data-category=potion] .crop-art{width:var(--potion-art-width);height:var(--potion-art-height);max-width:150%}
.unified-shop .shop-list::before{bottom:0}
@media(min-width:601px) and (min-height:551px){
 .shop-art-layout::before{background-size:calc(1723 * var(--su)) calc(1013 * var(--su));background-position:calc(97 * var(--su)) calc(67 * var(--su))}
 .unified-shop .shop-main{height:calc(830 * var(--su))}
 .unified-shop{--potion-art-width:calc(195 * var(--su));--potion-art-height:calc(195 * var(--su))}
 .unified-shop .shop-list{grid-template-rows:1fr 1fr 1.5fr}
}
@media(max-width:600px){
 .shop-art-layout::before{background-size:100% calc(100% - 22px)}
 .unified-shop .shop-main{margin-top:35px}
 .unified-shop .shop-list{grid-template-rows:140px 140px 210px}
}
@media(min-width:601px) and (max-height:550px){
 .shop-art-layout::before{background-size:100% calc(100% - 12px)}
 .unified-shop .shop-main{margin-top:35px}
 .unified-shop .shop-list{grid-template-rows:126px 126px 189px}
}

.shop-art-layout .card-price[data-unaffordable=true],.shop-art-layout .detail-total[data-unaffordable=true],.shop-art-layout .detail-total[data-unaffordable=true] strong{color:#c52c38}
.shop-art-layout .card-price[data-unaffordable=true],.shop-art-layout .detail-total[data-unaffordable=true]{background:#ffd0d3;box-shadow:inset 0 0 0 1px #e98790}

/* Compact level notation can still add a second line to long crop names. */
.shop-art-layout .shop-detail .detail-name{display:flex;align-items:center;justify-content:center;white-space:normal;overflow-wrap:anywhere;font-size:20px;line-height:1.15;letter-spacing:0;padding-top:5px;padding-bottom:5px}
/* Localized facts grow vertically instead of compressing into adjacent rows. */
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts{min-width:0;min-height:0;justify-content:flex-start;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b68c62 transparent;scrollbar-gutter:stable}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div{display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:start;flex:none;min-height:0;gap:8px;padding:7px 0;border-bottom-width:2px}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts .item-fact-label{min-width:0;align-items:flex-start;padding:0;white-space:normal;overflow-wrap:normal;word-break:normal;line-height:1.35}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts .item-fact-label>span{white-space:normal;overflow-wrap:normal;word-break:normal;line-height:1.35}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div>strong{min-width:max-content;white-space:nowrap;overflow-wrap:normal;word-break:normal;line-height:1.35;font-variant-numeric:tabular-nums;text-align:right}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div[data-fruit-fact="mutation"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div[data-fruit-fact="mutation"]>strong{min-width:0;white-space:normal;overflow-wrap:normal}
#game-window[data-panel="shop"] .shop-art-layout .shop-copy strong{letter-spacing:0;overflow-wrap:normal;word-break:normal}
#game-window[data-panel="shop"] .shop-art-layout .detail-total strong{white-space:nowrap;overflow-wrap:normal;word-break:normal}
@media(orientation:landscape) and (max-height:700px),(orientation:landscape) and (max-width:1050px){
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail{grid-template-rows:var(--shop-preview-size) 44px minmax(0,1fr) 48px 18px}
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail .detail-name{height:44px;min-height:0;font-size:13px;line-height:1.1;overflow:hidden;overflow-wrap:normal;padding:1px 0}
 #game-window[data-panel="shop"] .shop-art-layout .shop-copy strong{display:flex;align-items:center;justify-content:center;min-height:3.6em;font-size:12px;line-height:1.2}
 #game-window[data-panel="shop"] .shop-art-layout .shop-item{justify-content:flex-start}
 #game-window[data-panel="shop"] .shop-art-layout .shop-copy :is(.slot-purchase-count,.slot-stock){font-size:10px;white-space:normal;line-height:1.25}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div{padding:5px 0;gap:5px}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts :is(span,strong){font-size:12px}
 body[data-story-panel="true"] #game-window[data-panel="shop"] .shop-art-layout .shop-detail{grid-template-rows:var(--shop-preview-size) 40px minmax(0,1fr) 44px 14px}
 body[data-story-panel="true"] #game-window[data-panel="shop"] .shop-art-layout .shop-detail .detail-name{height:40px;font-size:12px}
}
@media(orientation:portrait) and (max-width:760px){
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail{grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);grid-template-rows:48px minmax(0,1fr) 48px 28px;padding:8px}
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail .detail-name{height:48px;font-size:14px;line-height:1.15;overflow:hidden;overflow-wrap:normal}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div{grid-template-columns:minmax(0,1fr);gap:2px;padding:5px 0}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts>div>strong{justify-self:end;font-size:13px}
 #game-window[data-panel="shop"] .shop-art-layout .shop-copy strong{min-height:3.6em;font-size:12px;line-height:1.2}
 #game-window[data-panel="shop"] .shop-art-layout .shop-copy :is(.slot-purchase-count,.slot-stock){font-size:10px;white-space:normal;line-height:1.25}
}

@media(min-width:1051px) and (min-height:701px){
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:calc(255 * var(--su)) auto minmax(0,1fr) calc(112 * var(--su)) auto;gap:calc(8 * var(--su));height:calc(785 * var(--su));padding:0 calc(44 * var(--su)) calc(16 * var(--su));overflow:hidden}
 #game-window[data-panel="shop"] .shop-art-layout .shop-selected-preview{position:relative;inset:auto;grid-area:1 / 1;width:100%;height:100%;margin:0}
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail .detail-art{width:calc(270 * var(--su));height:calc(270 * var(--su));max-width:100%;background-size:contain}
 #game-window[data-panel="shop"] .shop-art-layout .quantity-control input{left:0;width:calc(78 * var(--su));height:calc(78 * var(--su));font-size:38px}
 #game-window[data-panel="shop"] .shop-art-layout .quantity-control button{top:calc(100 * var(--su));width:calc(64 * var(--su));height:calc(70 * var(--su));min-width:36px;min-height:40px}
 #game-window[data-panel="shop"] .shop-art-layout .quantity-control button[data-delta="-1"]{left:0}
 #game-window[data-panel="shop"] .shop-art-layout .quantity-control button[data-delta="1"]{right:0}
 #game-window[data-panel="shop"] .shop-art-layout .shop-detail .detail-name{position:static;grid-area:2 / 1;width:100%;max-width:100%;height:auto;min-height:48px;margin:0;padding:4px 0;translate:none;font-size:20px;line-height:1.25;overflow-wrap:normal}
 #game-window[data-panel="shop"] .shop-art-layout :is(.detail-facts,.unified-potion-facts){position:static;grid-area:3 / 1;width:100%;height:100%;margin:0;padding:0 8px 0 0;font-size:16px;line-height:1.35;overflow-y:auto}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts :is(span,strong){font-size:16px}
 #game-window[data-panel="shop"] .shop-art-layout .detail-facts.item-facts .item-fact-label>img{width:22px;height:22px}
 #game-window[data-panel="shop"] .shop-art-layout .shop-checkout{position:relative;inset:auto;grid-area:4 / 1;display:flex;align-items:center;width:100%;height:100%;min-height:0;margin:0;padding:0 calc(108 * var(--su)) 0 0}
 #game-window[data-panel="shop"] .shop-art-layout .detail-total{position:static;width:100%;height:calc(82 * var(--su));min-height:48px;padding:5px 10px;font-size:16px;gap:4px;flex-direction:column;justify-content:center}
 #game-window[data-panel="shop"] .shop-art-layout .detail-total strong{font-size:20px}
 #game-window[data-panel="shop"] .shop-art-layout .shop-cart-button{inset:50% 0 auto auto;transform:translateY(-50%);width:calc(102 * var(--su));height:calc(102 * var(--su));min-width:48px;min-height:48px;padding:calc(22 * var(--su))}
 #game-window[data-panel="shop"] .shop-art-layout .detail-footnote{position:static;grid-area:5 / 1;width:100%;height:auto;min-height:28px;margin:0;font-size:11px;line-height:1.3;overflow-wrap:normal}
 #game-window[data-panel="shop"] .unified-shop .shop-list{grid-template-rows:repeat(3,minmax(0,1fr));gap:calc(14 * var(--su));padding-top:calc(38 * var(--su));padding-bottom:calc(24 * var(--su));overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
 #game-window[data-panel="shop"] .unified-shop .shop-item .crop-art{width:calc(130 * var(--su));height:calc(130 * var(--su));max-width:100%}
 #game-window[data-panel="shop"] .unified-shop .shop-copy{margin:0;min-width:0}
 #game-window[data-panel="shop"] .unified-shop .shop-copy strong{display:flex;align-items:center;justify-content:center;min-height:3.6em;font-size:16px;line-height:1.2}
 #game-window[data-panel="shop"] .unified-shop .shop-copy small{font-size:11px;white-space:normal;line-height:1.25;margin-top:2px}
}
@media(max-width:600px){
 #trade-warehouse-shortcut{top:16px;bottom:auto;right:12px;transform:none}
 #trade-warehouse-shortcut button{width:42px;height:44px;min-height:44px;padding:4px;border-radius:8px}
 #trade-warehouse-shortcut button img{width:30px;height:30px}
 #trade-warehouse-shortcut button span{display:none}
}