@import url('/shared/ui-text-fonts-v1.css');
@import url('/shared/brand-lockup.css?v=20261024');
:root{--paper:#fbf6ea;--white:#fffdf8;--ink:#173f73;--copy:#496585;--line:#173f7324;--hand:ContentHand,'PingFang SC',sans-serif;color-scheme:light}
*{box-sizing:border-box}
body{margin:0;background:var(--white);color:var(--ink);font:15px/1.5 'Yuanti SC','STYuanti','Avenir Next','PingFang SC',sans-serif}
a{color:inherit;text-decoration:none}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #4a90d9;outline-offset:4px}[hidden]{display:none!important}
.skip{position:fixed;top:8px;left:12px;z-index:20;transform:translateY(-150%);background:white;padding:10px}.skip:focus{transform:none}
.brand-block{margin-bottom:40px}.brand.zb-brand-lockup{--brand-title-font:var(--hand);--brand-copy-font:'Yuanti SC','STYuanti','Avenir Next','PingFang SC',sans-serif;--brand-caption-color:var(--copy)}
.zb-ui-symbol{width:24px!important;height:24px!important;flex:0 0 24px!important}
h1,h2,p{margin-top:0}.intro h1{font:42px/1.35 var(--hand);margin:0 0 10px;white-space:nowrap}.intro h1 span{color:#e97843}
.sidebar{position:fixed;inset:0 auto 0 0;width:216px;padding:32px 20px;background:var(--paper);border-right:1px solid var(--line);display:flex;flex-direction:column;overflow:auto}
.nav-section+.nav-section{margin-top:24px}.nav-label{font-size:11px;color:var(--copy);margin:0 12px 8px;letter-spacing:.06em}
.nav-home{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 12px;border-radius:9px;background:#e3edf7;font-size:14px;font-weight:600;box-shadow:inset 3px 0 var(--ink)}
.personal-link{min-height:48px;display:flex;align-items:center;gap:12px;font-size:14px;border-radius:8px;padding:0 12px;margin-top:4px}.personal-link:hover{background:#e9eef2}
.sidebar-foot{margin-top:auto;padding:40px 10px 0;font-size:12px;line-height:1.8}.sidebar-foot span{font-size:10px;color:var(--copy)}
.workspace{margin-left:216px;padding:32px 44px 48px}.workspace-inner{max-width:1100px;margin:auto}.workspace-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px;gap:20px}.location{font-size:13px;color:var(--copy)}.intro{padding-top:4px}
.search-wrap{position:relative;width:min(420px,100%);z-index:5}.search-box{min-height:46px;display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;background:#fffefb;padding:0 14px}.search-box:focus-within{border-color:#4a90d9;box-shadow:0 0 0 3px #4a90d915}.search-box input{width:100%;min-width:0;border:0;outline:none;background:transparent;font-size:13px;color:var(--ink);height:44px}.search-box input::placeholder{color:#687c94}.search-box input:focus-visible{outline:0}.search-box kbd{white-space:nowrap;font:11px 'Avenir Next',sans-serif;color:var(--copy);background:#f3f0e8;border:1px solid #173f731a;border-radius:4px;padding:2px 5px}
.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:380px;overflow:auto;background:#fffdf8;border:1px solid var(--line);box-shadow:0 14px 40px #173f731c;border-radius:12px;padding:8px}.search-results a{display:flex;align-items:center;gap:10px;min-height:52px;border-radius:7px;padding:6px}.search-results a:hover{background:#edf3f5}.search-results img{width:32px;height:32px;object-fit:contain}.search-results small{margin-left:auto;color:var(--copy);font-size:11px}.search-results p{margin:8px;font-size:13px}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin:26px 0 16px}.section-heading h2{font-size:16px;font-weight:600;margin:0}.section-heading>span{font-size:12px;color:var(--copy)}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.product{--tint:#fdeaf1;--accent:#b73b70;position:relative;min-width:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--white);transition:transform .16s,border-color .16s,box-shadow .16s}.product:hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 8px 22px #173f730b}.product.blue{--tint:#e5f1fa;--accent:#29699d}.product.yellow{--tint:#fff4cc;--accent:#866521}.product.orange{--tint:#feecd9;--accent:#ad5429}.product.latte{--tint:#f2e8dc;--accent:#896143}.product.purple{--tint:#eee8fc;--accent:#76589a}
.art{display:flex;align-items:center;justify-content:center;background:var(--tint);height:128px}.art img{object-fit:contain;display:block;width:108px;height:108px}.product-copy{padding:17px 20px 14px}.product h2{font:29px/1.2 var(--hand);margin:0 0 8px}.product-type{font-size:12px;color:var(--copy);margin:0}.make-link{font-size:12px;font-weight:600;display:block;color:var(--accent);margin-top:14px}.quiet-foot{font-size:12px;color:var(--copy);margin:24px 0 0}
@media(min-width:1800px){.workspace{padding-top:56px}.workspace-top{margin-bottom:48px}}
@media(max-width:1180px){.workspace{padding-left:30px;padding-right:30px}.product-copy{padding-left:15px;padding-right:15px}.intro h1{font-size:36px}}
@media(max-width:900px){.sidebar{width:180px;padding:24px 14px}.workspace{margin-left:180px;padding:26px}.workspace-top{margin-bottom:30px}.location{display:none}.search-wrap{width:100%}.intro h1{font-size:31px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.art{height:100px}.art img{width:88px;height:88px}}
@media(max-width:600px){.sidebar{position:static;width:auto;padding:18px;border:0;border-bottom:1px solid var(--line)}.brand-block{margin:0 0 16px}.sidebar .creation-nav,.sidebar-foot,.nav-label{display:none}.nav-section+.nav-section{margin:0}.sidebar nav{display:flex;flex-wrap:wrap;gap:3px}.personal-link{padding:0 9px;font-size:12px;min-height:40px;margin:0}.personal-link .zb-ui-symbol{display:none!important}.workspace{margin:0;padding:24px 18px}.workspace-top{margin-bottom:26px}.intro h1{font-size:30px;white-space:normal}.section-heading{gap:12px}.section-heading>span{display:none}.product-grid{gap:12px}.product h2{font-size:24px}.product-copy{padding:14px 12px}.product-type{font-size:11px;min-height:34px}.make-link{margin-top:8px}.quiet-foot{display:none}.search-box kbd{display:none}}
@media(min-width:901px) and (max-height:820px){.workspace{padding-top:24px}.workspace-top{margin-bottom:18px}.intro h1{font-size:36px;margin-bottom:0}.section-heading{margin-top:20px;margin-bottom:14px}.art{height:100px}.art img{width:88px;height:88px}.product-copy{padding-top:13px;padding-bottom:11px}.product h2{font-size:26px;margin-bottom:6px}.make-link{margin-top:8px}.quiet-foot{margin-top:18px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* Approved desktop fullscreen layout; ordinary and short windows keep their spacing. */
@media (min-width:1200px) and (min-height:960px) {
  .workspace {
    min-height:100svh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding-block:64px;
  }
  .workspace-inner {
    width:100%;
    max-width:clamp(1100px,66vw,1320px);
    margin:0 auto;
  }
  .workspace-top { margin-bottom:40px; }
  .section-heading { margin-top:28px; margin-bottom:20px; }
  .product-grid { gap:24px; }
  .art { height:clamp(128px,13.3svh,160px); }
  .art img { width:clamp(108px,10.8svh,130px); height:clamp(108px,10.8svh,130px); }
  .quiet-foot { margin-top:26px; }
}
.shop-choice.product {
  display: flex;
  flex-direction: column;
}
.shop-card-main { display: block; }
.shop-direct-links {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 12px 12px;
}
.shop-direct-links a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 4px 9px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--tint);
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
}
.shop-direct-links a:hover { border-color: var(--accent); }
.shop-direct-links a:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
