/* Marketplace trial; previous UI is saved in backups/ui-before-marketplace-2026-10-20. */
body { background:#f5f7fb; }
.topbar,.topbar-home { background:#fff; }
.market-header-search { display:flex; align-items:center; flex:1; gap:10px; background:#f2f5fa; border:1px solid #dbe3ef; border-radius:12px; padding:5px 6px 5px 14px; min-width:0; }
.market-header-search>svg { width:20px; height:20px; flex:none; color:#748ba7; }
.market-header-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; font:inherit; font-size:14px; color:#294462; }
.market-header-search:focus-within { outline:2px solid #6489b6; outline-offset:2px; }
.market-header-search button { border:0; border-radius:8px; background:#315e96; color:#fff; padding:9px 20px; font:inherit; font-size:13px; cursor:pointer; }
.market-home { padding-top:24px; padding-bottom:32px; }
.market-promo-row { display:grid; grid-template-columns:2.2fr 1fr; gap:18px; }
.market-promo { position:relative; display:flex; align-items:center; justify-content:space-between; padding:30px 34px; min-height:235px; background:linear-gradient(110deg,#e7effd,#eaf5f5); border:1px solid #d9e5f4; border-radius:20px; overflow:hidden; }
.market-eyebrow { font-size:10px; letter-spacing:2px; font-weight:800; color:#6982a4; }
.market-promo h1 { font-size:30px; line-height:1.35; color:#243d5a; margin:10px 0; letter-spacing:-.6px; }
.market-promo h1 em { font-style:normal; color:#35679f; }
.market-promo p { color:#647e9a; font-size:13px; margin:0 0 16px; }
.market-cta { display:inline-flex; align-items:center; gap:22px; padding:11px 18px; border-radius:10px; background:#315e96; color:white; font-size:13px; font-weight:700; }
.market-promo-art { position:relative; display:grid; place-items:center; width:190px; height:185px; flex:none; border-radius:50%; background:#ffffff70; transform:rotate(7deg); }
.market-promo-art img { width:145px; height:145px; object-fit:contain; border-radius:24px; mix-blend-mode:multiply; }
.market-promo-art>span { position:absolute; right:0; top:0; font-size:35px; color:#d9ad55; }
.market-promo-art b { position:absolute; right:-10px; bottom:0; padding:10px 16px; background:#fff; border-radius:12px; color:#4b729b; font-size:11px; box-shadow:0 8px 18px #315e9612; }
.market-shortcuts { display:grid; gap:14px; }
.market-shortcuts>a { display:flex; align-items:center; gap:14px; padding:20px; border:1px solid #dfe6f0; border-radius:18px; background:#fff; color:#35506e; }
.market-shortcuts>a>span { display:grid; place-items:center; width:46px; height:46px; background:#eff0fc; color:#7e70b8; border-radius:14px; font-size:27px; flex:none; }
.market-shortcuts>a:nth-child(2)>span { background:#fff4dc; color:#bd9443; }
.market-shortcuts b { display:block; font-size:15px; }
.market-shortcuts small { display:block; color:#8392a4; margin-top:4px; font-size:11px; }
.market-shortcuts i { margin-left:auto; font-style:normal; }
.market-categories { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; padding:22px 16px; background:#fff; border:1px solid #e5eaf2; border-radius:18px; margin:20px 0 26px; }
.market-categories button { display:flex; flex-direction:column; align-items:center; gap:9px; padding:8px 2px; color:#53657d; border:0; background:transparent; cursor:pointer; font:inherit; font-size:12px; }
.market-categories button>span { display:grid; place-items:center; height:48px; width:48px; background:#eef2fa; border-radius:16px; font-size:26px; color:#567ba9; }
.market-categories .category-0 { background:#fcecf2; color:#ba7192; }.market-categories .category-1 { background:#f0ecfc; color:#8f75bc; }.market-categories .category-2 { background:#fff2e2; color:#be8953; }.market-categories .category-3 { background:#e9f1fc; color:#5f85b3; }.market-categories .category-4 { background:#e9f6ef; color:#69a089; }
.market-categories button[aria-pressed=true] { color:#315e96; font-weight:800; }.market-categories button[aria-pressed=true]>span { outline:2px solid #7196c4; outline-offset:3px; }
.market-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:16px; }
.market-section-heading h2 { margin:0 0 3px; font-size:23px; color:#263f5e; }.market-section-heading p { margin:0; font-size:12px; color:#8292a6; }.market-section-heading>a { font-size:12px; color:#476e9e; }
.market-tabs { display:flex; border-bottom:1px solid #dce4ef; gap:8px; }.market-tabs button { background:transparent; border:0; border-bottom:3px solid transparent; padding:13px 25px; font:inherit; font-size:14px; color:#7d8ca0; cursor:pointer; }.market-tabs button[aria-pressed=true] { color:#315e96; border-color:#315e96; font-weight:800; }
.market-result-count { font-size:11px; color:#8292a6; margin:14px 0; }
.market-home .product-grid { grid-template-columns:repeat(5,minmax(0,1fr)); gap:16px; }.market-home .product-card-modern .card-media { height:155px; }.market-home .product-card-modern { box-shadow:0 3px 10px #29446206; }.market-home .product-card-modern:hover { box-shadow:0 7px 20px #29446216; }
.market-help { display:flex; gap:24px; flex-wrap:wrap; justify-content:center; padding:25px; margin-top:24px; font-size:13px; color:#6d829b; }
.market-account-links { display:flex; flex-wrap:wrap; gap:12px; padding-top:22px; }.market-account-links>a { background:#fff; border:1px solid #dce5f1; border-radius:12px; padding:14px 18px; color:#315e96; font-size:13px; }
@media(max-width:1000px) { .market-promo-row { grid-template-columns:1fr; }.market-shortcuts { grid-template-columns:1fr 1fr; }.market-home .product-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:640px) {
 .topbar-inner { flex-wrap:wrap; gap:8px; padding-top:9px; padding-bottom:8px; }.market-header-search { flex-basis:100%; order:3; padding:4px 5px 4px 11px; border-radius:10px; }.market-header-search input { font-size:16px; }.market-header-search button { font-size:12px; padding:8px 14px; }.navband { display:none; }.platform-bar { padding-top:0; }.bottom-nav { grid-template-columns:repeat(5,1fr); }.bottom-nav a,.bottom-nav button { min-width:0; }
 .market-home { padding-top:12px; }.market-promo-row { gap:10px; }.market-promo { min-height:174px; padding:18px 16px; border-radius:15px; }.market-eyebrow { font-size:8px; letter-spacing:1px; }.market-promo h1 { font-size:20px; margin:7px 0; }.market-promo p { font-size:10px; max-width:185px; margin-bottom:12px; }.market-cta { padding:8px 11px; font-size:11px; gap:10px; }.market-promo-art { width:95px; height:105px; margin-right:-6px; }.market-promo-art img { width:90px; height:95px; }.market-promo-art b { font-size:8px; padding:6px 8px; bottom:-14px; right:-1px; }.market-promo-art>span { font-size:23px; }
 .market-shortcuts { gap:9px; }.market-shortcuts>a { padding:11px 9px; gap:7px; border-radius:12px; }.market-shortcuts>a>span { width:30px; height:34px; font-size:20px; border-radius:9px; }.market-shortcuts b { font-size:11px; }.market-shortcuts small { font-size:9px; }.market-shortcuts i { display:none; }
 .market-categories { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px 4px; padding:14px 7px; margin:12px 0 22px; border-radius:14px; }.market-categories button { font-size:10px; gap:7px; padding:5px 0; }.market-categories button>span { width:39px; height:39px; font-size:24px; border-radius:12px; }
 .market-section-heading { align-items:flex-start; margin-bottom:10px; }.market-section-heading h2 { font-size:18px; }.market-section-heading p { font-size:10px; }.market-section-heading>a { font-size:10px; max-width:85px; text-align:right; }.market-tabs { gap:0; }.market-tabs button { flex:1; padding:11px 3px; font-size:12px; white-space:nowrap; }.market-home .product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.market-home .product-card-modern .card-media { height:110px; }.market-help { padding:14px 0; gap:12px; font-size:11px; }.market-account-links { gap:8px; }.market-account-links>a { flex:1 1 40%; padding:12px; font-size:12px; }
}
@media(max-width:360px) { .market-promo h1 { font-size:17px; }.market-promo-art { width:72px; }.market-promo-art img { width:75px; }.market-promo p { max-width:160px; }.market-shortcuts small { display:none; } }
.market-home a,.market-account-links a { text-decoration:none; }
.topbar-home::before { display:none; }
/* Original welcome and member section inside the marketplace layout. */
.market-promo-row { grid-template-columns:minmax(0,1fr); }
.market-promo-row>.home-motion { min-width:0; border:1px solid #d9e5f4; border-radius:20px; overflow:hidden; }
.market-promo-row .hero-brand-section { margin:0; }
.market-promo-row .hero.wrap { width:100%; max-width:none; padding:28px; gap:24px; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); }
.market-promo-row .hero-copy,.market-promo-row .hero-scene { min-width:0; }
.market-promo-row .hero h1 { font-size:clamp(25px,3vw,38px); }
.market-promo-row .market-shortcuts { grid-template-columns:1fr 1fr; }
#market-products-title { scroll-margin-top:150px; }
@media(max-width:760px) {
 .market-promo-row .hero.wrap { grid-template-columns:minmax(0,1fr); padding:20px 16px; gap:18px; }
 .market-promo-row .hero h1 { font-size:28px; }
 .market-promo-row .hero .lede { font-size:13px; }
 .market-promo-row .hero-stats { margin-top:16px; }
 .market-promo-row .hero-scene { padding-top:90px; }
 .market-promo-row .member-card { padding:16px; }
}
/* Compact welcome panel. */
.market-promo-row .hero.wrap { margin:0; padding:20px 24px; gap:16px 24px; }
.market-promo-row .hero h1 { font-size:30px; line-height:1.25; margin:8px 0; }
.market-promo-row .hero .lede { font-size:12px; line-height:1.65; margin:10px 0; }
.market-promo-row .hero-copy .kicker { font-size:10px; padding:4px 9px; margin:0 0 8px; }
.market-promo-row .hero-actions { margin:12px 0; gap:8px; }
.market-promo-row .hero-actions .btn { padding:9px 14px; font-size:12px; }
.market-promo-row .hero-stats { margin-top:12px; }
.market-promo-row .hero-stats>div { padding:10px 12px; }
.market-promo-row .hero-stats dt { font-size:10px; }
.market-promo-row .hero-stats dd { font-size:17px; }
.market-promo-row .hero-scene { padding-top:68px; padding-bottom:0; }
.market-promo-row .hero-mascot-cloud { height:70px; }
.market-promo-row .hero-mascot { transform:scale(.72); transform-origin:top center; }
.market-promo-row .member-card { padding:15px 17px; border-radius:16px; }
.market-promo-row .mc-top { margin-bottom:10px; }
.market-promo-row .mc-user { margin-bottom:10px; }
.market-promo-row .mc-avatar { width:34px; height:34px; font-size:18px; }
.market-promo-row .mc-coins { padding:10px 12px; margin:10px 0; }
.market-promo-row .mc-actions .btn { padding:8px 11px; font-size:11px; }
.market-promo-row .mc-today { font-size:11px; }
.market-promo-row .creator-ribbon { padding:7px 0; }
.market-promo-row .creator-ribbon span { font-size:11px; }
@media(max-width:760px) {
 .market-promo-row .hero.wrap { padding:16px 14px; gap:12px; }
 .market-promo-row .hero h1 { font-size:25px; }
 .market-promo-row .hero-scene { padding-top:58px; }
 .market-promo-row .hero-mascot-cloud { height:60px; }
 .market-promo-row .hero-mascot { transform:scale(.62); }
 .market-promo-row .member-card { padding:12px; }
 .market-promo-row .hero-stats>div { padding:8px; }
 .market-promo-row .hero-stats dd { font-size:15px; }
}
/* Keep utility shortcuts compact instead of stretching to the hero height. */
.market-promo-row .market-shortcuts { align-self:start; align-items:start; grid-auto-rows:auto; gap:10px; }
.market-promo-row .market-shortcuts>a { min-height:0; height:auto; padding:12px 16px; gap:10px; border-radius:12px; }
.market-promo-row .market-shortcuts>a>span { width:34px; height:34px; border-radius:10px; font-size:22px; }
.market-promo-row .market-shortcuts b { font-size:12px; }
.market-promo-row .market-shortcuts small { margin-top:2px; font-size:10px; }
@media(max-width:640px) {
 .market-promo-row .market-shortcuts>a { padding:10px 8px; gap:7px; }
 .market-promo-row .market-shortcuts>a>span { width:28px; height:30px; font-size:19px; }
 .market-promo-row .market-shortcuts b { font-size:11px; }
 .market-promo-row .market-shortcuts small { font-size:9px; }
}
/* Soft utility tiles that blend into the page background. */
.market-promo-row .market-shortcuts>a {
 border-color:transparent;
 background:linear-gradient(110deg,rgba(231,236,249,.7),rgba(245,247,251,.15));
 box-shadow:none;
 transition:background-color .25s ease,box-shadow .25s ease;
}
.market-promo-row .market-shortcuts>a:nth-child(2) {
 background:linear-gradient(110deg,rgba(248,240,220,.55),rgba(245,247,251,.15));
}
.market-promo-row .market-shortcuts>a:hover {
 background-color:rgba(255,255,255,.5);
 box-shadow:0 4px 16px rgba(49,94,150,.035);
}
.market-promo-row .market-shortcuts>a>span { background:rgba(232,228,249,.65); }
.market-promo-row .market-shortcuts>a:nth-child(2)>span { background:rgba(251,237,203,.65); }
.market-promo-row .market-shortcuts>a:focus-visible { outline:2px solid #7196c4; outline-offset:3px; }
/* Champagne line icons on ivory, with a dark selected tile. */
.market-categories button>span[class],.market-categories button>span {
 background:linear-gradient(145deg,#fffefa,#eee8dc); color:#947541;
 border:1px solid #c6af7838; border-radius:14px;
 box-shadow:inset 0 1px 0 #fff,0 3px 9px #76613d09;
 transition:transform .22s ease,box-shadow .22s ease;
}
.market-categories button>span svg { width:25px; height:25px; }
.market-categories button { color:#756c5e; }
.market-categories button[aria-pressed=true] { color:#66502f; }
.market-categories button[aria-pressed=true]>span {
 background:linear-gradient(145deg,#364557,#202d3e); color:#e8cd94;
 border-color:#c5a771; outline:1px solid #c5a77166; outline-offset:3px;
 box-shadow:inset 0 1px 0 #ffffff20,0 4px 12px #28364a18;
}
@media(hover:hover) { .market-categories button:hover>span { transform:translateY(-3px); box-shadow:0 6px 14px #76613d15; } }
@media(prefers-reduced-motion:reduce) { .market-categories button>span { transition:none; } }
@media(max-width:640px) { .market-categories button>span svg { width:22px; height:22px; } }
/* Borderless welcome banner. */
.market-promo-row>.home-motion,
.market-promo-row .hero-brand-section,
.market-promo-row .hero.wrap { border:0; box-shadow:none; }
.support-widget{position:fixed;right:22px;bottom:22px;z-index:85;font-size:13px}
.support-launcher{margin-left:auto;display:flex;align-items:center;gap:9px;border:1px solid #bfa778;background:linear-gradient(125deg,#344961,#203047);color:#f1dbab;border-radius:99px;padding:13px 18px;box-shadow:0 8px 24px #243b5630;cursor:pointer;font:inherit;font-weight:700}
.support-launcher svg{width:24px;height:24px}.support-panel{width:min(370px,calc(100vw - 28px));height:min(540px,calc(100dvh - 110px));display:flex;flex-direction:column;background:#fff;border:1px solid #e1e6ed;border-radius:20px;overflow:hidden;box-shadow:0 16px 60px #20304730;margin-bottom:12px;animation:supportEnter .2s ease-out}
.support-head{display:flex;justify-content:space-between;align-items:center;padding:16px;background:linear-gradient(120deg,#30455f,#1f3047);color:#f4dfb0}.support-head small{display:block;color:#d2dce8;font-size:11px;margin-top:4px}.support-head button{border:0;background:transparent;color:white;font-size:26px;width:40px;height:40px;cursor:pointer}
.support-notice{margin:0;padding:8px 14px;font-size:10px;color:#7d6b50;background:#faf7f0}.support-topics{display:flex;flex-wrap:wrap;gap:6px;padding:12px}.support-topics button{font:inherit;font-size:11px;padding:7px 10px;border:1px solid #e4e8ef;border-radius:99px;color:#375271;background:#f7f9fc;cursor:pointer}
.support-history{flex:1;min-height:70px;overflow-y:auto;overscroll-behavior:contain;padding:0 14px 12px;display:flex;flex-direction:column;gap:10px}.support-message{max-width:92%;padding:10px 12px;background:#f0f3f8;color:#344960;border-radius:14px;overflow-wrap:anywhere;flex-shrink:0}.support-message p{margin:0;line-height:1.7;white-space:pre-wrap}.support-message a{display:inline-block;margin-top:8px;color:#315e96;font-weight:700}.support-message.user{align-self:flex-end;background:#304b6d;color:white}
.support-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;color:#6e7b8c;font-size:10px}.support-tools button{border:0;background:transparent;color:#315e96;white-space:nowrap;cursor:pointer;font:inherit;padding:8px}.support-form{display:flex;gap:8px;padding:12px;border-top:1px solid #edf0f5}.support-form input{min-width:0;flex:1;border:1px solid #dce4ef;border-radius:10px;padding:10px;font:inherit}.support-form button{border:0;border-radius:10px;padding:10px 14px;background:#304b6d;color:white;font:inherit;cursor:pointer}.support-form button:disabled{opacity:.4;cursor:default}
.support-widget button:focus-visible,.support-form input:focus-visible{outline:2px solid #b49a63;outline-offset:2px}.basket-fab{right:170px}
@keyframes supportEnter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:640px){.support-widget{right:12px;bottom:calc(78px + env(safe-area-inset-bottom))}.support-launcher{width:48px;height:48px;padding:12px;justify-content:center}.support-launcher span{display:none}.support-panel{height:min(480px,calc(100dvh - 210px));margin-bottom:8px}.support-form input{font-size:16px}}
@media(prefers-reduced-motion:reduce){.support-panel{animation:none}}