@import url("/assets/fonts/noto-sans-tc-400.css");

:root {
  --ims-brown: #4a2a17;
  --ims-brown-2: #734018;
  --ims-orange: #d95419;
  --ims-gold: #c88b3b;
  --ims-paper: #fffaf0;
  --ims-paper-2: #f8ead3;
  --ims-border: #d8a965;
  --ims-green: #20a61f;
  --ims-muted: #725f4e;
}

html { background:#4d8a3f; }
body {
  min-height:100vh;
  color:var(--ims-brown)!important;
  background:#4d8a3f url("/assets/ims-market-background.png") center top/cover fixed no-repeat!important;
  font-family:"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;
}

.topbar {
  position:sticky!important;
  top:0;
  z-index:90;
  width:calc(100% - 136px)!important;
  min-height:118px!important;
  margin:10px auto 0!important;
  padding:0 48px!important;
  background:linear-gradient(180deg,rgba(255,253,246,.99),rgba(249,237,216,.99))!important;
  border:4px solid #7d451d!important;
  border-radius:5px!important;
  box-shadow:0 5px 0 #4c2a16,0 9px 22px rgba(45,27,10,.28)!important;
  backdrop-filter:none!important;
}
.topbar:before,.topbar:after {
  content:"";
  position:absolute;
  inset:7px;
  pointer-events:none;
  border:1px solid rgba(191,133,61,.45);
}
.header-shell {
  width:100%;
  min-height:110px!important;
  grid-template-columns:270px minmax(520px,1fr) 190px!important;
  gap:28px!important;
}
.topbar .brand { height:102px; flex-direction:column!important; justify-content:center!important; align-items:center!important; gap:0!important; }
.header-logo {
  width:220px!important;
  height:78px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 2px 0 rgba(255,255,255,.8));
}
.brand-copy{display:block!important;height:24px!important}
.brand-copy img{width:190px!important;height:24px!important;object-fit:contain!important}
.brand-copy small{display:none!important}
.desktop-nav {
  height:110px!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(112px,1fr));
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
}
.desktop-nav button {
  height:58px;
  min-width:0!important;
  padding:0 18px!important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  border-right:1px solid #ddc3a2!important;
  color:#3f2a1d!important;
  background:transparent!important;
  font-size:18px!important;
  font-weight:900!important;
  white-space:nowrap;
}
.desktop-nav button:last-child{border-right:0!important}
.desktop-nav button:after{bottom:1px!important;left:22px!important;right:22px!important;height:3px!important}
.desktop-nav button.active{color:#d24d17!important}
.desktop-nav button.active:after{background:#d24d17!important}
.nav-icon{font-size:28px;line-height:1;color:#60452f}
.desktop-nav button.active .nav-icon{color:#b96122}

#loginBtn.line-login-card {
  width:190px!important;
  height:60px!important;
  min-height:60px!important;
  padding:0 19px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#28bd28,#128b12)!important;
  border:3px solid #086c0b!important;
  border-radius:13px!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.32),0 4px 0 #075d08!important;
  font-size:18px;
}
#loginBtn .line-mark{color:#128b12!important;background:#fff!important}

.app{width:100%!important;max-width:none!important;margin:0!important;padding:0 0 28px!important}
#homeView {
  width:calc(100% - 136px)!important;
  max-width:1540px!important;
  margin:0 auto!important;
  background:transparent;
  border-left:3px solid #8b5629;
  border-right:3px solid #8b5629;
  box-shadow:0 12px 30px rgba(35,22,8,.28);
}

.marketplace-hero {
  min-height:420px!important;
  padding:34px 44px 0!important;
  gap:22px!important;
  overflow:visible!important;
  color:var(--ims-brown)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.02) 0%,rgba(255,255,255,.02) 66%,rgba(255,248,235,.78) 91%,rgba(255,248,235,.98) 100%),
    url("/assets/ims-market-background.png") center 43%/cover no-repeat!important;
}
.marketplace-hero:before{display:none!important}
.hero-copy{z-index:2!important}
.hero-copy .hero-ornament,.hero-copy p{display:none!important}
.marketplace-hero .hero-copy h2 {
  margin:0!important;
  color:#38261b!important;
  font:900 clamp(35px,3.2vw,52px)/1.18 "Noto Sans TC","Microsoft JhengHei",sans-serif!important;
  letter-spacing:.045em!important;
  text-shadow:-3px -3px 0 #fff,3px -3px 0 #fff,-3px 3px 0 #fff,3px 3px 0 #fff,0 6px 10px rgba(74,42,23,.26)!important;
  white-space:nowrap;
}
.market-search {
  width:min(750px,80%)!important;
  height:82px;
  margin:0 auto!important;
  padding:0 20px!important;
  display:grid!important;
  grid-template-columns:1fr 58px!important;
  gap:0!important;
  border:2px solid #a36f3c!important;
  border-radius:44px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 3px 9px rgba(67,40,17,.12)!important;
}
.market-keyword{height:78px!important;border:0!important;background:transparent!important}
.market-keyword input{font-size:21px!important;color:#51453c!important;background:transparent!important}
.market-keyword input::placeholder{color:#746b64!important;opacity:1}
.search-leading-icon{width:38px!important;height:38px!important;stroke:#51443b!important;stroke-width:2.4!important}
.market-search select{display:none!important}
#heroSearchBtn {
  width:56px!important;
  height:56px!important;
  align-self:center;
  padding:0!important;
  color:#5d4a3d!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
#heroSearchBtn .search-button-icon{display:none!important}

.adventure-actions {
  width:min(640px,72%)!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:48px!important;
  margin:0 auto 8px!important;
}
.adventure-actions .wood-sign {
  min-height:72px!important;
  padding:8px 26px!important;
  color:#fff!important;
  background:
    linear-gradient(90deg,rgba(75,37,10,.2),transparent 15% 85%,rgba(75,37,10,.2)),
    linear-gradient(180deg,#d99032,#b95f17)!important;
  border:4px solid #5b2c0d!important;
  border-radius:5px!important;
  box-shadow:inset 0 0 0 2px #f5b85f,0 5px 0 #3e1c08!important;
  font-size:31px!important;
  text-shadow:0 3px 0 #6d2f10;
}
.adventure-actions .wood-sign:before,.adventure-actions .wood-sign:after{content:"•";color:#55280c;position:absolute}
.adventure-actions .wood-sign{position:relative}
.adventure-actions .wood-sign:before{left:10px}.adventure-actions .wood-sign:after{right:10px}
.adventure-actions .wood-sign b{color:#fff!important}

.category-grid {
  width:calc(100% + 88px)!important;
  margin-top:3px!important;
  padding:14px 48px!important;
  display:grid!important;
  grid-template-columns:repeat(6,1fr)!important;
  gap:28px!important;
  background:rgba(255,250,241,.98)!important;
  border-top:2px solid #cf9c58!important;
  border-bottom:1px solid #e2bc85!important;
}
.category-grid button {
  min-height:58px!important;
  padding:8px 18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:13px!important;
  color:#3c291d!important;
  background:#fffaf2!important;
  border:1px solid #d6a164!important;
  border-radius:12px!important;
  box-shadow:none!important;
}
.category-grid img{width:46px!important;height:46px!important;object-fit:contain!important}
.category-grid b{font:900 19px/1.2 "Noto Sans TC","Microsoft JhengHei",sans-serif!important}.category-grid small{display:none!important}

.home-operations {
  margin:0!important;
  padding:16px 46px 18px!important;
  gap:12px!important;
  background:linear-gradient(180deg,rgba(255,252,245,.99),rgba(250,238,217,.99))!important;
  border:0!important;
  border-radius:0!important;
}
.market-heading{display:flex!important;align-items:center!important;justify-content:space-between!important}
.market-heading>div:first-child{display:flex!important;align-items:center!important;gap:10px!important}
.market-heading h3{font:900 25px/1.2 "Noto Sans TC","Microsoft JhengHei",sans-serif!important;color:#3c281c!important}.flame{font-size:29px!important;color:#e44b14!important}
.market-tabs{display:none!important}
.more-products{margin-left:auto!important;color:#6b3c17!important;background:transparent!important;border:0!important;font-size:16px!important;font-weight:900!important}
.secondary-home-panel{display:none!important}
.home-product-row{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important}
.home-mini-card {
  min-height:142px!important;
  grid-template-columns:118px minmax(0,1fr)!important;
  gap:13px!important;
  padding:12px!important;
  color:#4a2a17!important;
  background:rgba(255,255,255,.83)!important;
  border:1px solid #dfb57d!important;
  border-radius:11px!important;
  box-shadow:0 2px 5px rgba(82,48,17,.08)!important;
}
.home-mini-card img,.home-mini-card .home-mini-placeholder{width:118px!important;height:104px!important;object-fit:contain!important;border-radius:8px!important;background:#fffaf2!important}
.home-mini-card h4{font-size:17px!important;color:#34251d!important}.home-mini-card p{font-size:13px!important;color:#7a5a43!important}
.home-mini-card b{font-size:21px!important;color:#d84d17!important}
.home-seller{display:flex!important;align-items:center;gap:8px!important}.online-state{margin-left:auto;color:#82776e}.online-state.online{color:#20a62a}.online-state.offline{color:#9b8d82}
.home-empty,.home-loading{background:rgba(255,255,255,.75)!important;border-color:#dcb680!important;color:#725f4e!important}

.trust-strip {
  margin:0 38px 0!important;
  padding:12px 8px!important;
  display:grid!important;
  grid-template-columns:repeat(4,1fr)!important;
  color:#3b2a20!important;
  background:rgba(255,252,244,.98)!important;
  border:3px solid #8a552a!important;
  border-radius:7px!important;
  box-shadow:inset 0 0 0 2px #e4bd83!important;
}
.trust-strip>div,.trust-strip>a{
  min-height:72px!important;
  padding:5px 22px!important;
  display:grid!important;
  grid-template-columns:66px 1fr!important;
  grid-template-rows:1fr 1fr!important;
  align-items:center!important;
  color:#3b2a20!important;
  border-right:1px dashed #d9a76e!important;
  text-decoration:none!important;
}
.trust-strip>a:last-child{border-right:0!important}
.trust-icon{grid-row:1/3!important;font-size:36px!important;line-height:1!important;text-align:center!important}
.trust-strip img.trust-icon{width:52px!important;height:52px!important;object-fit:contain!important}
.trust-line{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;color:#fff!important;background:#21aa2b;font-size:10px!important;font-weight:1000}
.support-icon{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;color:#fff!important;background:#6c4a2e;font-size:13px!important;font-weight:900}
.trust-strip b{font-size:18px!important}.trust-strip small{font-size:14px!important;color:#6f6258!important}

@media(max-width:1100px){
  .topbar,#homeView{width:calc(100% - 32px)!important}
  .topbar{padding:0 22px!important}.header-shell{grid-template-columns:205px 1fr 150px!important;gap:12px!important}
  .header-logo{width:195px!important}.desktop-nav button{font-size:15px!important;padding:0 8px!important}.nav-icon{font-size:22px}
  #loginBtn.line-login-card{width:150px!important}
  .category-grid{gap:12px!important}.home-product-row{grid-template-columns:repeat(2,1fr)!important}
}

@media(max-width:760px){
  body{background-position:center top!important;background-size:auto 100vh!important}
  .topbar{position:relative!important;width:100%!important;min-height:82px!important;margin:0!important;padding:0 14px!important;border-width:0 0 3px!important;border-radius:0!important}
  .header-shell{min-height:82px!important;grid-template-columns:1fr auto!important;gap:8px!important}
  .topbar .brand{align-items:flex-start!important}.header-logo{width:154px!important;height:74px!important}.brand-copy{display:none!important}.desktop-nav{display:none!important}
  #loginBtn.line-login-card{width:128px!important;height:48px!important;min-height:48px!important;font-size:14px!important}
  #homeView{width:100%!important;border:0!important}
  .marketplace-hero{min-height:520px!important;padding:34px 16px 0!important;gap:20px!important;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,248,232,.86) 72%,#fff8e8 100%)!important}
  .marketplace-hero .hero-copy h2{font-size:30px!important;line-height:1.35!important;white-space:normal!important;max-width:360px}
  .market-search{width:100%!important;height:64px!important;padding:0 12px!important;grid-template-columns:1fr 34px!important}.market-keyword{height:60px!important}.market-keyword input{font-size:16px!important}.search-leading-icon{width:28px!important;height:28px!important}
  .adventure-actions{width:100%!important;gap:14px!important}.adventure-actions .wood-sign{min-height:62px!important;font-size:23px!important;padding:5px 12px!important}
  .category-grid{width:calc(100% + 32px)!important;margin-top:auto!important;padding:12px 16px!important;grid-template-columns:repeat(3,1fr)!important;gap:9px!important}.category-grid button{min-height:54px!important;padding:6px!important}.category-grid img{width:34px!important;height:34px!important}.category-grid b{font-size:15px!important}
  .home-operations{padding:16px 12px!important}.market-heading h3{font-size:21px!important}.home-product-row{grid-template-columns:1fr!important}.home-mini-card{grid-template-columns:94px 1fr!important;min-height:116px!important}.home-mini-card img,.home-mini-card .home-mini-placeholder{width:94px!important;height:90px!important}
  .trust-strip{margin:0 10px!important;grid-template-columns:1fr 1fr!important}.trust-strip>div,.trust-strip>a{grid-template-columns:48px 1fr!important;padding:8px!important;border-bottom:1px dashed #d9a76e!important}.trust-strip>:nth-child(2){border-right:0!important}.trust-strip>:nth-child(3),.trust-strip>:nth-child(4){border-bottom:0!important}.trust-icon{font-size:28px!important}.trust-line{width:40px;height:40px;font-size:8px!important}.trust-strip b{font-size:14px!important}.trust-strip small{font-size:12px!important}
}
