/* Market artwork and parchment presentation; gameplay stays in social.js. */
.content-scroll:has(> .market-scene){padding:0;gap:0}
.market-scene{flex:0 0 auto;min-width:0;min-height:100%;display:flex;flex-direction:column;background:#f5ecd9;color:var(--text);padding-bottom:20px}
.market-scene *{box-sizing:border-box}
.market-scene .town-banner-block{flex-shrink:0;margin:0;border:0;border-radius:0;box-shadow:none;overflow:visible;position:relative}
.market-scene .mkt-hero{min-height:340px;padding:40px 34px 70px;background:linear-gradient(0deg,#55351a26,transparent 45%),url('../assets/market-ui/market-hero.webp') center 48%/cover no-repeat;justify-content:flex-end;overflow:visible}
.market-scene .mkt-hero-sign{position:relative;align-self:flex-start;max-width:540px;padding:26px 30px 24px;border:5px double #7f4d23;border-radius:8px 14px 10px 6px;background:repeating-linear-gradient(0deg,transparent 0 34px,#78472325 35px,#fff4cf35 37px),linear-gradient(100deg,#bc864b,#f0d5a1 20%,#e4b778 75%,#c89559);box-shadow:0 5px 0 #57361fd9,0 10px 20px #28160960,inset 0 0 0 3px #f8dfac99;color:#482a16;text-align:center}
.market-scene .mkt-hero-sign::before,.market-scene .mkt-hero-sign::after{content:'';position:absolute;width:42px;height:54px;background:url('../assets/ui/zier-blatt.webp') center/contain no-repeat;pointer-events:none}
.market-scene .mkt-hero-sign::before{top:-18px;left:-16px;transform:rotate(-35deg)}
.market-scene .mkt-hero-sign::after{right:-14px;bottom:-18px;transform:rotate(140deg)}
.market-scene .mkt-hero-title{display:block;font-size:clamp(26px,2.8vw,40px);text-shadow:0 1px 0 #fff0c9;color:#422710;margin:0 0 8px;line-height:1.2}
.market-scene .mkt-hero-sub{font-size:13px;opacity:1;color:#4c301c;text-shadow:none;margin:0 0 16px;max-width:none;font-weight:700}
.market-scene .mkt-hero-meta{justify-content:center;gap:7px}
.market-scene .mkt-hero-stat{background:#775139;color:#fff8e4;border:1px solid #f7dfa380;font-size:10px;padding:4px 9px;box-shadow:inset 0 1px 2px #3f200a55;text-shadow:none;backdrop-filter:none}
.market-scene .town-tabnav{position:relative;margin:-46px 24px 0;width:max-content;max-width:calc(100% - 48px);border:1px solid #e5cfb0;border-radius:10px 10px 0 0;box-shadow:0 4px 12px #64462130;background:#fffdf5f5;z-index:3}
.market-scene .town-tab{font-size:12px;padding:13px 18px}
.market-scene .mkt-page{flex:0 0 auto;min-height:0;margin:14px 24px 0;border:1px solid #cfaa72;border-radius:18px;box-shadow:0 0 0 5px #f8dfb066,0 6px 20px #70501c15;background:radial-gradient(ellipse at 0 50%,#eac98b33,transparent 65%),linear-gradient(100deg,#fff7e5,#fffdf5 45%,#fff3db);padding:8px 12px 20px;z-index:1}
.market-scene .mkt-page::before,.market-scene .mkt-page::after{width:100px;height:110px;opacity:.5;bottom:-15px}
.market-scene .mkt-tabs-bar{position:relative;top:auto;background:linear-gradient(#fff9ed,#f7e5c6);border:1px solid #e6c99f;border-radius:12px;padding:7px;gap:6px;margin:4px 3px 0;z-index:2}
.market-scene .mkt-tabs-bar-btn{border:1px solid transparent;border-radius:9px;color:#6a4d37;margin:0;padding:11px 14px;font-size:13px;min-height:44px}
.market-scene .mkt-tabs-bar-btn.active{background:linear-gradient(#eb96a9,#ca5672);border-color:#b35e70;color:#fff;box-shadow:inset 0 0 0 2px #ffe6e180,0 2px 5px #6b3c3c30;text-shadow:0 1px 2px #793644}
.market-scene .mkt-tabs-bar-btn[data-mkt-tab="sell"]{flex:0 0 auto;background:linear-gradient(#a37b54,#775035);border:1px solid #68452d;color:#fff8e8;box-shadow:inset 0 0 0 2px #d7b58866;margin-left:20px;padding:11px 24px}
.market-scene .mkt-filter-bar{background:transparent;border-bottom:1px solid #dfcaa8;padding:16px 8px 14px}
.market-scene .mkt-filter-label{color:#71513b;min-width:70px}
.market-scene .mkt-filter-chips{gap:6px}
.market-scene .mkt-filter-chips .btn{border-color:#e0d1b9;background:#fffdf8;box-shadow:0 2px 3px #6d4b1e0b;min-height:30px;padding:5px 10px}
.market-scene .mkt-filter-chips .btn.pri{background:linear-gradient(#695167,#3b334d);border-color:#9a6e60;color:#fff!important;box-shadow:0 2px 4px #543a3a40}
.market-scene .mkt-sort-bar{padding:13px 8px 12px;background:transparent;border:0;position:relative;margin-bottom:5px}
.market-scene .mkt-sort-bar>span{font-weight:800;color:#6c4228!important}
.market-scene .mkt-sort-bar .btn{background:#fffdf7;border-color:#e0cbaa;color:#725239;min-height:34px}
.market-scene .mkt-sort-bar .btn.pri{background:#8c6648;color:#fff8e8;border-color:#795236}
.market-scene .mkt-card-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;padding:0 7px 10px;align-items:stretch}
.market-scene .mkt-card-grid::before{width:min(70%,360px);height:48px;justify-self:center;margin:0;background-size:contain;background-position:center;opacity:.7}
.market-scene .mkt-card{background:linear-gradient(135deg,#fffdf5,#fff9ed);border:1px solid #ddc69e;border-radius:13px;padding:12px;box-shadow:inset 0 0 0 3px #fffdf8,0 3px 8px #7250230e;min-height:214px}
.market-scene .mkt-card[data-rar="l"]{background:linear-gradient(120deg,#fff7df,#fffdf4 55%,#fff0d0);border-color:#e8b360}
.market-scene .mkt-card.mine{border-color:#9480b6}
.market-scene .mkt-card::after{display:none}
.market-scene .mkt-card-top{gap:12px;margin-bottom:10px}
.market-scene .mkt-card-emoji{width:76px;height:106px;background:linear-gradient(140deg,#fffae7,#f0e3c6);border:1px solid #d9b87e;border-radius:10px;box-shadow:inset 0 0 0 3px #fffaf0;padding:5px}
.market-scene .mkt-card-img{filter:drop-shadow(0 3px 2px #5f3f1a20)}
.market-scene .mkt-card-name{display:flex;flex-direction:column;align-items:flex-start;gap:5px;font-size:13px;line-height:1.35;margin-bottom:8px}
.market-scene .mkt-card-title{order:1}
.market-scene .mkt-rarity-label{order:0;display:inline-block;padding:3px 9px;background:linear-gradient(#b4b7ba,#8c919c);border-radius:20px;color:#fff;font-size:10px;font-weight:800;box-shadow:inset 0 1px 0 #fff7}
.market-scene [data-rar="l"] .mkt-rarity-label{background:linear-gradient(#efb33f,#d48119)}
.market-scene [data-rar="e"] .mkt-rarity-label{background:linear-gradient(#b18be0,#8053b1)}
.market-scene [data-rar="r"] .mkt-rarity-label{background:linear-gradient(#88b6ff,#507bdd)}
.market-scene .mkt-card-stats{font-size:11px;line-height:1.6;color:#7c8595}
.market-scene .mkt-card-meta>.btn{min-height:30px;font-size:11px;padding:5px 10px;margin-top:9px!important;background:#fffdf7;border:1px solid #e4d6bd;color:#4d5570;box-shadow:0 2px 5px #6c553515}
.market-scene .mkt-card-seller{font-size:10px;border:0;padding:0 0 8px;color:#8c8276}
.market-scene .mkt-card-footer .btn{min-height:34px;min-width:82px;border:1px solid #7b4c24;background:linear-gradient(#c39559,#a57034);color:#fff9e9;box-shadow:inset 0 0 0 2px #edc99866,0 2px 5px #8a5a2a30;font-size:12px}
.market-scene .mkt-card-price{color:#d78017;font-size:16px}
.market-scene .mkt-scene-footer{position:relative;z-index:0;min-height:220px;aspect-ratio:2172/540;background:url('../assets/market-ui/market-footer.webp') bottom center/100% auto no-repeat;margin-top:-35px;pointer-events:none}
.market-scene .mkt-row,.market-scene .mkt-sell-row{margin:10px 7px;border:1px solid #dfcba9;border-radius:12px;background:#fffaf0;padding:16px}
.market-scene .mkt-sell-info{background:#f5e6ce;border-color:#e4cba4;margin:12px 7px;border-radius:10px}
.market-scene .mkt-empty{padding:40px 18px}
.market-scene .btn:focus-visible,.market-scene button:focus-visible{outline:3px solid #b16f46;outline-offset:3px}
[data-theme=dark] .market-scene{background:#292922}
[data-theme=dark] .market-scene .mkt-page{background:linear-gradient(110deg,#302e27,#242b2a);border-color:#76603d;box-shadow:0 0 0 5px #69503533,0 6px 20px #0002}
[data-theme=dark] .market-scene .mkt-tabs-bar{background:#332e29;border-color:#72604a}
[data-theme=dark] .market-scene .mkt-tabs-bar-btn{color:#ddcbb5}
[data-theme=dark] .market-scene .mkt-filter-label,[data-theme=dark] .market-scene .mkt-sort-bar>span{color:#dec5a2!important}
[data-theme=dark] .market-scene .mkt-filter-chips .btn,[data-theme=dark] .market-scene .mkt-sort-bar .btn{background:#353635;border-color:#635948;color:#e7d9c2}
[data-theme=dark] .market-scene .mkt-filter-chips .btn.pri,[data-theme=dark] .market-scene .mkt-sort-bar .btn.pri{background:#73516c;color:#fff}
[data-theme=dark] .market-scene .mkt-filter-bar{border-color:#64563e}
[data-theme=dark] .market-scene .mkt-card,[data-theme=dark] .market-scene .mkt-row,[data-theme=dark] .market-scene .mkt-sell-row{background:linear-gradient(130deg,#37362e,#293030);border-color:#786346;box-shadow:inset 0 0 0 3px #ffffff08,0 3px 8px #0002}
[data-theme=dark] .market-scene .mkt-card-title{color:#f3e5ca}
[data-theme=dark] .market-scene .mkt-card-stats,[data-theme=dark] .market-scene .mkt-card-seller{color:#b6b4aa}
[data-theme=dark] .market-scene .mkt-card-meta>.btn{background:#39403e;border-color:#6d6654;color:#d7e5ee}
[data-theme=dark] .market-scene .mkt-sell-info{background:#3c352c;border-color:#67593e}
@media(min-width:1600px){.market-scene .mkt-hero{min-height:370px}.market-scene .mkt-card-grid{grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}.market-scene .mkt-page{margin-left:34px;margin-right:34px}}
@media(max-width:900px){.market-scene .mkt-hero{min-height:300px;padding:30px 24px 65px}.market-scene .mkt-hero-sign{padding:20px;max-width:440px}.market-scene .mkt-card-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.market-scene .mkt-page{margin:12px 14px 0;padding:7px 7px 18px}.market-scene .mkt-tabs-bar-btn[data-mkt-tab="sell"]{margin-left:0;padding:10px 15px}.market-scene .town-tab{padding:12px}}
@media(max-width:640px){.market-scene .mkt-hero{min-height:280px;padding:24px 18px 56px;background-position:57% 45%}.market-scene .mkt-hero-sign{padding:17px 13px;max-width:100%;align-self:center}.market-scene .mkt-hero-title{font-size:26px}.market-scene .mkt-hero-sub{font-size:11px}.market-scene .mkt-hero-stat{font-size:9px;padding:4px 7px}.market-scene .town-tabnav{width:auto;max-width:none;margin:-42px 14px 0}.market-scene .mkt-tabs-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}.market-scene .mkt-tabs-bar-btn{font-size:12px;padding:10px 6px}.market-scene .mkt-card-grid{grid-template-columns:1fr;gap:12px;padding:0 6px 10px}.market-scene .mkt-card{min-height:205px}.market-scene .mkt-card-emoji{width:88px;height:112px}.market-scene .mkt-card-title{font-size:14px}.market-scene .mkt-card-meta>.btn,.market-scene .mkt-card-footer .btn{min-height:44px}.market-scene .mkt-filter-chips{flex-wrap:wrap;overflow:visible;gap:5px}.market-scene .mkt-filter-row{overflow:visible}.market-scene .mkt-filter-chips .btn{min-height:38px}.market-scene .mkt-sort-bar{gap:10px;padding:14px 7px}.market-scene .mkt-sort-bar .btn{min-height:38px;font-size:11px}.market-scene .mkt-scene-footer{min-height:170px;aspect-ratio:auto;background-size:auto 185px;margin-top:-20px}.market-scene .mkt-page::before,.market-scene .mkt-page::after{width:62px;height:70px}.market-scene .mkt-sell-row{flex-wrap:wrap;gap:12px}.market-scene .mkt-sell-right{width:100%}}
@media(prefers-reduced-motion:reduce){.market-scene .mkt-card:hover{transform:none}}
@media(min-width:1600px){.market-scene .mkt-card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:640px){.market-scene .town-tabnav{margin:0;max-width:100%;width:100%;border-radius:0 0 10px 10px}}
/* Reference composition: a framed trading board within the market scenery. */
.market-scene{background:#c8aa7f url('../assets/market-ui/market-hero.webp') center/cover no-repeat;padding-bottom:14px}
.market-scene .mkt-hero{min-height:320px}
.market-scene .mkt-hero-sign{padding:20px 28px;max-width:490px}
.market-scene .mkt-page{margin-top:6px;padding-bottom:16px;border:2px solid #bb8e56;border-radius:16px;box-shadow:0 0 0 5px #e9c99ccc,0 8px 24px #462a1955}
.market-scene .mkt-page::before,.market-scene .mkt-page::after{bottom:-12px;opacity:.6}
.market-scene .mkt-filter-bar{padding-top:11px;padding-bottom:10px}
.market-scene .mkt-sort-bar{padding-top:9px;padding-bottom:8px}
.market-scene .mkt-card-grid{gap:11px}
.market-scene .mkt-card{min-height:190px;padding:10px}
.market-scene .mkt-card-emoji{width:68px;height:96px}
.market-scene .mkt-card-name{font-size:12px;gap:4px;margin-bottom:5px}
.market-scene .mkt-card-stats{font-size:10px}
.market-scene .mkt-card-meta>.btn{margin-top:7px!important;min-height:28px;font-size:10px}
.market-scene .mkt-card-seller{padding-bottom:6px}
.market-scene .mkt-scene-footer{min-height:110px;height:110px;aspect-ratio:auto;margin-top:-8px;background-size:100% auto;background-position:center bottom}
[data-theme=dark] .market-scene{background-color:#292922;background-image:linear-gradient(#16211b44,#16211b44),url('../assets/market-ui/market-hero.webp')}
[data-theme=dark] .market-scene .mkt-page{box-shadow:0 0 0 5px #695035bb,0 8px 24px #0005}
@media(min-width:1200px){.market-scene .mkt-card-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:1600px){.market-scene .mkt-hero{min-height:340px}}
@media(max-width:900px){.market-scene .mkt-hero{min-height:290px}.market-scene .mkt-page{margin-top:10px}.market-scene .mkt-scene-footer{height:90px;min-height:90px}}
@media(max-width:640px){.market-scene .mkt-hero{min-height:280px}.market-scene .mkt-hero-sign{padding:17px 13px}.market-scene .mkt-card{min-height:205px}.market-scene .mkt-card-emoji{width:88px;height:112px}.market-scene .mkt-card-name{font-size:14px}.market-scene .mkt-card-stats{font-size:11px}.market-scene .mkt-card-meta>.btn{min-height:44px;font-size:11px}.market-scene .mkt-scene-footer{height:85px;min-height:85px;background-size:auto 185px}}
