/* home-20261004 (Lei 10-04): the new header -- five items on the right, menus that open on hover -- the home hero's
   four doors into the model market, and the contact card. Colours are flowith.css's own tokens; /static/* is cached
   for a year, so a change here ships under a new file name. */
:root{--hd-fade:250,248,244;--hd-save:#16a34a;--hd-red:#E5484D;
  --hd-mizi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%231C2226' stroke-opacity='.10'%3E%3Crect x='.5' y='.5' width='55' height='55'/%3E%3Cpath d='M28 0v56M0 28h56M0 0l56 56M56 0L0 56' stroke-dasharray='2.5 3'/%3E%3C/g%3E%3C/svg%3E")}
:root[data-theme="dark"]{--hd-fade:15,20,23;--hd-save:#4ade80;
  --hd-mizi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23E8EAE7' stroke-opacity='.10'%3E%3Crect x='.5' y='.5' width='55' height='55'/%3E%3Cpath d='M28 0v56M0 28h56M0 0l56 56M56 0L0 56' stroke-dasharray='2.5 3'/%3E%3C/g%3E%3C/svg%3E")}

/* ---------------- header ---------------- */
.topbar .nav2 .nav-link,.topbar .nav2 .nav-trigger{font-weight:500;letter-spacing:.01em}
.topbar .nav2 .nav-trigger .caret{opacity:.6;transition:transform .2s}
.topbar .nav2 .dropdown.open>.nav-trigger .caret{transform:rotate(180deg)}
.topbar .nav2 .dropdown>.dropdown-menu{transition:opacity .16s .12s,transform .16s .12s,visibility 0s .28s}
.topbar .nav2 .dropdown>.dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.topbar .nav2 .dropdown.open>.dropdown-menu{transition:opacity .16s,transform .16s,visibility 0s}
@media (hover:hover) and (min-width:861px){
  .topbar .nav2 .dropdown:hover>.dropdown-menu,.topbar .hd-bell:hover>.dropdown-menu{opacity:1;visibility:visible;transform:none;transition:opacity .16s,transform .16s,visibility 0s}
  .topbar .nav2 .dropdown:hover>.nav-trigger{color:var(--ink);background:var(--bg-2)}
  .topbar .nav2 .dropdown:hover>.nav-trigger .caret{transform:rotate(180deg)}
}
/* 模型市场 */
.topbar .nav2 .hd-mm{width:470px;padding:8px}
.topbar .nav2 .hd-mm>a.hd-mm-row{display:grid;grid-template-columns:64px minmax(0,1fr);gap:14px;align-items:center;padding:9px 10px;border-radius:12px}
.hd-mm-th{width:64px;height:46px;border-radius:9px;border:1px solid var(--line);background:var(--bg-2) center/cover no-repeat}
.topbar .nav2 .hd-mm-row b{display:block;font-size:14.5px;font-weight:700}
.topbar .nav2 .hd-mm-row span.hd-mm-d{display:block;font-size:12.5px;color:var(--muted);line-height:1.45;margin-top:2px}
.hd-mm-ft{display:flex;justify-content:space-between;gap:12px;padding:11px 12px 6px;margin-top:4px;border-top:1px solid var(--line)}
.topbar .nav2 .hd-mm-ft a{display:inline;padding:0;font-size:13.5px;font-weight:700;color:var(--accent);background:none}
/* 资源: a wide panel of cards on 米字格 paper */
.topbar .nav2 .dropdown.hd-wide{position:static}
.topbar .nav2 .hd-wide>.dropdown-menu{left:0;right:0;margin-inline:auto;top:calc(100% + 6px);width:min(1160px,calc(100% - 48px));min-width:0;padding:16px 18px 14px}
.hd-res-h{font-size:13px;font-weight:600;color:var(--muted);letter-spacing:.04em;margin:0 0 12px 2px}
.hd-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.topbar .nav2 .hd-cards>a{display:flex;flex-direction:column;gap:0;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--bg);
  transition:border-color .2s,transform .2s,box-shadow .2s}
.topbar .nav2 .hd-cards>a:hover{background:var(--bg);border-color:var(--accent-line);transform:translateY(-2px);box-shadow:var(--shadow)}
.hd-ill{position:relative;height:108px;background:var(--bg-2) var(--hd-mizi) center/56px 56px;border-bottom:1px solid var(--line);display:grid;place-items:center}
.hd-ico{width:52px;height:52px;border-radius:12px;background:var(--surface);border:1px solid var(--line-2);display:grid;place-items:center;color:var(--ink-2);box-shadow:var(--shadow-sm);transition:color .2s}
.hd-cards>a:hover .hd-ico{color:var(--accent)}
.hd-ico svg{width:24px;height:24px}
.hd-tag{position:absolute;top:10px;right:10px;font:600 10.5px/1 var(--mono);letter-spacing:.08em;padding:5px 7px;border:1px solid var(--line-2);border-radius:6px;background:var(--surface);color:var(--ink-2)}
.hd-new{position:absolute;top:10px;left:10px;width:9px;height:9px;border-radius:50%;background:var(--hd-red);box-shadow:0 0 0 3px var(--bg-2)}
.hd-bd{display:flex;flex-direction:column;gap:5px;padding:13px 15px 14px;flex:1}
.topbar .nav2 .hd-bd b{font-size:15.5px;font-weight:700}
.topbar .nav2 .hd-bd span.hd-d{font-size:13px;color:var(--muted);line-height:1.55;flex:1}
.topbar .nav2 .hd-bd span.hd-go{font:600 12px var(--mono);color:var(--ink-2);margin-top:6px}
.hd-cards>a:hover .hd-go{color:var(--accent)!important}
.hd-strip{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;margin-top:12px;padding:11px 4px 0;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.topbar .nav2 .hd-strip a{display:inline;padding:0;font-weight:600;color:var(--ink-2);background:none}
.topbar .nav2 .hd-strip a:hover{color:var(--accent)}
/* 支持 */
.topbar .nav2 .hd-sup{width:320px;padding:6px;left:auto;right:0}
.topbar .nav2 .hd-sup .hd-it{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:10px;border-radius:10px;
  font-size:14px;font-weight:500;line-height:1.3;font-family:inherit;color:var(--ink);background:none;border:0;cursor:pointer;text-align:left}
.topbar .nav2 .hd-sup .hd-it:hover{background:var(--bg-2)}
.hd-l{display:flex;align-items:center;gap:10px;min-width:0}
.hd-l>span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-si{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--bg-2);color:var(--ink-2);flex:none}
.hd-si svg{width:16px;height:16px}
.topbar .nav2 .hd-sup small{font-size:12px;color:var(--soft);font-weight:500;white-space:nowrap}
.hd-sup hr{border:0;border-top:1px solid var(--line);margin:4px 8px}
.hd-wx{display:grid;grid-template-columns:104px minmax(0,1fr);gap:12px;align-items:center;margin:0 4px 6px;padding:10px;border-radius:12px;background:var(--bg)}
.hd-wx[hidden]{display:none}
.hd-wx img{width:104px;height:104px;border-radius:10px;border:1px solid var(--line);background:#fff;object-fit:cover}
.hd-wx-k{font-size:12px;color:var(--muted)}
.hd-wx-id{font:600 14px var(--mono);margin:2px 0 6px;overflow-wrap:anywhere;color:var(--ink)}
.hd-wx-h{font-size:12px;color:var(--muted);line-height:1.5;margin-top:6px}
.hd-cp{font-size:12px;font-weight:700;line-height:1;font-family:inherit;color:var(--accent);background:none;border:1px solid var(--accent-line);border-radius:8px;padding:5px 9px;cursor:pointer;white-space:nowrap}
.hd-cp:hover{background:var(--accent-soft)}
/* 网站公告 bell */
.hd-bell{position:relative}
.hd-bell .ann-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--hd-red);box-shadow:0 0 0 2px var(--bg)}
.hd-bell .ann-dot[hidden]{display:none}
.topbar .hd-bell>.dropdown-menu{left:auto;right:0;width:360px;min-width:0;padding:6px}
.topbar .hd-bell>.dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.hd-ann-h{display:flex;justify-content:space-between;align-items:center;padding:9px 10px 7px;font-size:13.5px;font-weight:700}
.topbar .hd-ann-h a{display:inline;padding:0;font-size:13px;font-weight:600;color:var(--accent);background:none}
.topbar .hd-bell .hd-ann{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px 10px;padding:10px;border-radius:10px;flex-direction:row}
.hd-ann-t{font-size:11px;font-weight:700;line-height:1;padding:5px 7px;border-radius:6px;margin-top:2px;white-space:nowrap;background:var(--bg-2);color:var(--ink-2)}
.hd-ann-t.t-launch{background:var(--jade-soft);color:var(--jade)}
.hd-ann-t.t-price_down,.hd-ann-t.t-soon{background:var(--accent-soft);color:var(--accent)}
.hd-ann-t.t-price_up{background:rgba(229,138,0,.12);color:#B26A00}
.hd-ann-t.t-unavailable,.hd-ann-t.t-retire{background:rgba(229,72,77,.12);color:var(--hd-red)}
.topbar .hd-bell .hd-ann b{font-size:13.5px;font-weight:600;line-height:1.5}
.hd-ann time{grid-column:2;font:12px var(--mono);color:var(--soft)}

/* ---------------- the four doors (home hero) ---------------- */
.collage[data-doors]{columns:auto;display:grid;grid-template-columns:var(--c1,1fr) var(--c2,1fr);grid-template-rows:var(--r1,1fr) var(--r2,1fr);gap:14px;
  transition:grid-template-columns .85s cubic-bezier(.22,.7,.18,1),grid-template-rows .85s cubic-bezier(.22,.7,.18,1)}
.collage[data-doors]>.door{position:relative;margin:0;grid-area:auto;width:auto;height:auto;min-width:0;min-height:0;border-radius:18px;overflow:hidden;
  border:1px solid var(--line);background:var(--bg-2);box-shadow:var(--shadow-sm);isolation:isolate;container-type:inline-size}
.collage[data-doors]>.door picture{position:absolute;inset:0;display:block}
.collage[data-doors]>.door img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 6.5s cubic-bezier(.2,.6,.2,1)}
.collage[data-doors]>.door.is-on img,.collage[data-doors]>.door:hover img{transform:scale(1.09)}
.collage[data-doors]>.door[data-door="chat"] img{object-position:center 22%}
.collage[data-doors]>.door[data-door="image"] img{object-position:center 40%}
.collage[data-doors]>.door[data-door="video"] img{object-position:center 28%}
.collage[data-doors]>.door[data-door="all"] img{object-position:center 42%}
.collage[data-doors] .nzm-pill{top:12px;bottom:auto}
.door-a{position:absolute;inset:0;z-index:4;display:block;color:var(--ink);text-decoration:none;border-radius:inherit}
.door-a:focus-visible{outline:2px solid var(--accent);outline-offset:-4px}
.door-sh{position:absolute;inset:0;background:linear-gradient(to top,rgba(var(--hd-fade),.97) 0%,rgba(var(--hd-fade),.86) 26%,rgba(var(--hd-fade),0) 62%)}
/* an open door carries more text: a deeper wash keeps it readable over the painting (both themes) */
.door-sh::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(var(--hd-fade),.97) 0%,rgba(var(--hd-fade),.92) 50%,rgba(var(--hd-fade),.55) 74%,rgba(var(--hd-fade),0) 92%);
  opacity:0;transition:opacity .6s}
.door.is-on .door-sh::after{opacity:1}
.door-go{position:absolute;top:14px;right:14px;width:36px;height:36px;border-radius:50%;background:var(--surface);border:1px solid var(--line);display:grid;place-items:center;
  color:var(--ink);opacity:0;transform:translate(-6px,6px);transition:opacity .4s,transform .4s}
.door-go svg{width:16px;height:16px}
.door.is-on .door-go,.door:hover .door-go{opacity:1;transform:none}
.door-tx{position:absolute;left:18px;right:18px;bottom:16px;display:flex;flex-direction:column;gap:3px}
.door-k{font-size:11.5px;font-weight:700;line-height:1;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
:lang(zh) .door-k,:lang(ja) .door-k,:lang(ko) .door-k{letter-spacing:.06em;font-size:12px}
.door-n{display:flex;align-items:baseline;gap:6px;margin-top:4px;white-space:nowrap;min-width:0}
.door-n b{font-size:38px;font-weight:900;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.door-n span{font-size:14px;font-weight:600;color:var(--ink-2);overflow:hidden;text-overflow:ellipsis}
.door-v{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.door-ls{display:grid;max-height:0;opacity:0;overflow:hidden;transition:max-height .7s cubic-bezier(.22,.7,.18,1),opacity .45s,margin .5s}
.door.is-on .door-ls{max-height:120px;opacity:1;margin-top:8px}
.door-li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-size:13px;padding:5px 0;border-top:1px dashed var(--line-2);min-width:0}
.door-li b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.door-li em{font:600 12.5px var(--mono);font-style:normal;color:var(--ink-2);white-space:nowrap}
.door-li i{font-style:normal;color:var(--hd-save);font-weight:800;font-size:11.5px;margin-left:6px}
.door-fr{font:600 12px var(--mono);color:var(--ink-2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@container (max-width:250px){.door-v{display:none}.door-n b{font-size:32px}.door-tx{left:14px;right:14px}}
@media (min-width:981px){.collage[data-doors]{max-height:680px}}
/* tall screens only: a capped door column sits in the middle of the hero. On a laptop it keeps the old collage's top
   edge, so a long language's taller copy cannot push the doors below the fold (ru at 1366x650 did). */
@media (min-width:981px) and (min-height:901px){.collage[data-doors]{align-self:center}}
@media (max-width:980px){
  .collage[data-doors]{grid-template-columns:1fr 1fr!important;grid-template-rows:210px 210px!important;height:auto;gap:12px}
  .door-ls,.door-go{display:none!important}
}
@media (max-width:640px){
  .collage[data-doors]{grid-template-rows:150px 150px!important;gap:10px}
  .door-v{display:none}
  .door-tx{left:12px;right:12px;bottom:11px}
  .door-n b{font-size:28px}.door-n span{font-size:12.5px}.door-fr{font-size:11px}
}
@media (prefers-reduced-motion:reduce){.collage[data-doors],.collage[data-doors] *{transition:none!important}}

/* ---------------- contact card ---------------- */
#contact-modal .modal.ct2{max-width:540px;text-align:left;padding:26px 26px 16px;position:relative}
#contact-modal .ct2 h2{text-align:left;font-size:22px;font-weight:800;letter-spacing:-.02em;margin:0 0 4px}
#contact-modal .ct2 .sub{text-align:left;margin:0}
.ct2-wx{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;align-items:center;margin-top:18px;padding:16px;border-radius:16px;background:var(--bg);border:1px solid var(--line)}
.ct2-wx img,.ct2-wx .ct2-ph{width:150px;height:150px;border-radius:12px;background:#fff;border:1px solid var(--line);object-fit:cover}
.ct2-ph{display:grid;place-items:center;color:var(--soft);font-size:12px;text-align:center;padding:10px}
.ct2-lb{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#07A35A}
.ct2-lb svg{width:18px;height:18px}
.ct2-id{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:8px 0}
.ct2-id code{font:700 18px var(--mono);letter-spacing:.02em;color:var(--ink);background:none;padding:0;overflow-wrap:anywhere}
.ct2-wx p{font-size:13px;color:var(--muted);line-height:1.6;margin:0}
.ct2-ch{list-style:none;margin:12px 0 0;padding:0;display:grid}
.ct2-ch li{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 4px;border-bottom:1px solid var(--line)}
.ct2-ch .ct2-ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--bg-2);color:var(--ink-2)}
.ct2-ch .ct2-ic svg{width:17px;height:17px}
.ct2-ch b{display:block;font-size:14.5px;font-weight:700}
.ct2-ch small{display:block;font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ct2-ext{font-size:13px;font-weight:700;color:var(--accent);white-space:nowrap}
.ct2-ft{display:flex;gap:18px;justify-content:center;padding-top:14px;font-size:13.5px;font-weight:600;color:var(--muted)}
.ct2-ft a:hover{color:var(--accent)}
@media (max-width:520px){
  .ct2-wx{grid-template-columns:1fr;justify-items:center;text-align:center}
  .ct2-id{justify-content:center}
  #contact-modal .modal.ct2{padding:22px 16px 14px}
}

/* home-20261004b (Lei's screenshot 10-04): the motion layer (.fx-nav, every visitor without reduced motion) makes .nav a
   positioned box for its sliding hover pill, so the wide 资源 panel measured itself against the nav (~400px) and
   squeezed its cards into a column. While 资源 is open the nav steps back to static -- the panel measures against the
   whole header again -- and the pill steps aside (the trigger keeps its own tint). The panel closes at once rather than
   fading, so it never re-lays out narrow on its way out. */
.fx-nav .topbar .nav2:has(> .hd-wide:hover),.fx-nav .topbar .nav2:has(> .hd-wide.open){position:static}
.fx-nav .topbar .nav2:has(> .hd-wide:hover) .nzm-navpill,.fx-nav .topbar .nav2:has(> .hd-wide.open) .nzm-navpill{opacity:0;transition:none}
.fx-nav .topbar .nav2 .hd-wide:hover>.nav-trigger,.fx-nav .topbar .nav2 .hd-wide.open>.nav-trigger{background:var(--bg-2);color:var(--ink)}
.fx-nav .topbar .nav2 .hd-wide>.dropdown-menu{transition:none}
.fx-nav .topbar .nav2 .hd-wide:hover>.dropdown-menu,.fx-nav .topbar .nav2 .hd-wide.open>.dropdown-menu{transition:opacity .16s,transform .16s,visibility 0s}