/* Homepage-only skin: shared collection/admin styles stay untouched. */
.home-page { --nav-h: 84px; }

.home-page .hero { justify-content: flex-start; align-items: center; background: radial-gradient(ellipse at 80% 30%, #334348, #11181c 75%); }
.home-page .hero__scrim { background: linear-gradient(90deg, #060a10bd 0%, #060a1075 55%, #060a102b 100%), linear-gradient(0deg, #080c12b3, transparent 35%, #080c1226); }
.home-page .hero__inner { text-align: left; margin: 0; }

.home-intro { color: #ffffffe0; font-size: clamp(15px, 1.35vw, 19px); line-height: 1.9; margin-top: 26px; }
.home-portals { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.home-portal { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid #ffffff6b; color: #fff; background: #ffffff12; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 12px 35px #00000012; transition: flex .5s cubic-bezier(.2,.7,.2,1), transform .35s, background .35s, color .35s, box-shadow .35s; }
.home-portal:hover { color: #fff; background: #ffffff26; text-decoration: none; transform: translateY(-5px); }
.home-portal.is-active { background: #fffffff0; color: #24292e; border-color: #fff; }
.home-portal.is-active:hover { background: #fff; color: #24292e; }
.home-portal__icon { display: grid; place-items: center; border-radius: 10px; background: #ffffffec; color: #252a30; font-weight: 700; }
.home-portal.is-active .home-portal__icon { background: #252a30; color: #fff; }

.home-portal strong { font-weight: 650; }
.home-portal__desc { opacity: .68; margin: 5px 0 18px; }
.home-portal__link { box-sizing: border-box; height: 38px; flex-shrink: 0; width: 100%; display: flex; justify-content: space-between; align-items: center; margin-top: auto; border: 1px solid transparent; border-top-color: #ffffff30; padding: 9px 0; white-space: nowrap; }
.home-portal.is-active .home-portal__link { background: #252a30; color: #fff; border: 1px solid transparent; border-radius: 4px; }

.home-page :focus-visible { outline-color: #2684ff; }
@media (min-width: 1500px) { .home-page .hero { padding-left: 9vw; } }
@media (max-width: 900px) {
 .home-page .hero { padding-inline: 6vw; }
 .home-portal { padding: 18px; }
}
@media (max-width: 640px) {
 .home-page .hero { min-height: 100svh; align-items: center; }
 .home-intro { font-size: 13px; }
 .home-portal { padding: 16px; }
 .home-portal.is-active { grid-column: 1 / -1; display: grid; grid-template-columns: 42px 1fr; column-gap: 15px; }
 .home-portal.is-active .home-portal__icon { grid-row: 1 / 3; }
 .home-portal.is-active .home-portal__desc { margin: 2px 0 12px; }
 .home-portal.is-active .home-portal__link { grid-column: 1 / -1; }
 .home-portal__icon { margin-bottom: 13px; }
 .home-portal__desc { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
 .home-portal { transition: none; }
 .home-portal:hover { transform: none; }
 .home-page .hero__bg video { transition: none; }
}
/* Single-screen landing and expandable product-style portals. */
.home-page { background: #10171d; color: #fff; }
.home-page .hero { box-sizing: border-box; }
.home-page .hero__inner { animation: home-enter .75s both; }

.home-portal.is-active { box-shadow: 0 16px 50px #0003; }
.home-portal__icon, .home-portal__link, .home-portal__link span { transition: background .35s, color .35s, transform .35s; }
.home-portal.is-active .home-portal__link span { transform: translateX(4px); }
.home-portal__desc { line-height: 1.5; }
@keyframes home-enter { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@media (min-width: 641px) {
 .home-portals { display: flex; }
 .home-portal { flex: 1; }
 .home-portal.is-active { flex: 1.65; }
 .home-portal__desc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
}
@media (max-width: 640px) {
 .home-portals { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
 .home-portal, .home-portal.is-active { display: flex; grid-column: auto; }
 .home-portal__desc { display: none; }
 .home-portal.is-active .home-portal__icon { margin: 0 0 16px; }
 .home-portal__link, .home-portal.is-active .home-portal__link { font-size: 11px; margin-top: 18px; padding: 10px 0 0; background: none; color: inherit; border-top: 1px solid #ffffff30; border-radius: 0; gap: 4px; }
 .home-portal.is-active .home-portal__link { border-color: #20293025; }
 .home-intro { margin-top: 18px; }
}
@media (max-height: 680px) and (min-width: 641px) {
 .home-page .hero { padding-bottom: 65px; }
 .home-intro { margin-top: 14px; font-size: 14px; }
 .home-portal { padding: 15px; }
 .home-portal__icon { margin-bottom: 10px; width: 32px; height: 32px; }
}
@media (prefers-reduced-motion: reduce) {
 .home-page *, .home-page *::after { animation: none !important; transition: none !important; }
}
/* Compact, lower entries. */

.home-portal { border-radius: 10px; }
.home-portal__icon { width: 34px; height: 34px; font-size: 23px; }

.home-portal strong { font-size: 19px; }
.home-portal__desc { font-size: 11px; }
.home-portal__link { font-size: 12px; padding-top: 10px; }
.home-portal.is-active .home-portal__link { padding: 9px 11px; }
@media (max-width: 640px) {
 .home-page { --nav-h: 70px; }
 .home-page .hero { padding-bottom: 48px; }
 .home-portal strong { font-size: 16px; }
 .home-portal__icon { width: 30px; height: 30px; font-size: 21px; }
 .home-portal.is-active .home-portal__icon { margin-bottom: 10px; }
 .home-portal.is-active .home-portal__link { padding: 10px 0 0; }
}

/* Compact cards with unchanged type. */

.home-page .hero { padding-left: 6vw; padding-top: 155px; padding-bottom: 30px; }
.home-portals { max-width: 550px; margin-top: 78px; }
.home-portal { padding: 13px 15px; }
.home-portal__icon { margin-bottom: 10px; }
.home-portal__desc { margin-bottom: 10px; }
@media (max-width:640px) {
 .home-page .hero { padding: 125px 5vw 30px; }
 .home-portal, .home-portal.is-active { padding: 10px 9px; min-height: 132px; }
}
@media (max-height:680px) and (min-width:641px) { .home-page .hero { padding-top:120px; }  }
/* Legacy spacing; viewport placement below takes precedence. */
@media (min-width:641px) {
 .home-page .hero__inner { transform: translateY(18px); }
 .home-portals { margin-top: 114px; }
}
@media (max-width:640px) { .home-portals { margin-top: 84px; } }
@media (max-height:680px) and (min-width:641px) { .home-portals { margin-top:76px; } }
/* Independent placement keeps intro centered when portal hover changes width. */
.home-page .hero { position:relative; padding:0; min-height:100svh; }
.home-page .hero__inner { position:relative; width:100%; max-width:none; height:100svh; transform:none; }
.home-page .home-intro { position:absolute; left:50%; transform:translate(-50%,-50%); margin:0; text-align:center; }
.home-page .home-portals { position:absolute; left:6vw; bottom:10svh; margin:0; }
@media(max-width:640px) { .home-page .home-intro { font-size:13px; } .home-page .home-portals { left:5vw; bottom:9svh; } }
@media(max-height:540px) { .home-page .hero,.home-page .hero__inner { min-height:540px; } .home-page .home-intro { top:34%; } }
/* Quote-like hierarchy: a leading statement and an offset, quieter response. */
.home-page .home-intro { top:30%; width:min(88%,960px); padding:24px 0; border:0; line-height:1.6; }
.home-intro > br { display:none; }
.home-intro [data-k="heroIntroLine1"] { display:block; padding-right:140px; font-size:clamp(21px,2.6vw,34px); font-weight:500; letter-spacing:-.025em; }
.home-intro [data-k="heroIntroLine2"] { display:block; padding-left:160px; margin-top:12px; color:#ffffffad; font-size:clamp(13px,1.5vw,18px); font-weight:400; }
@media(max-width:640px) { .home-page .home-intro { top:27%; width:90%; padding:20px 0; } .home-intro [data-k="heroIntroLine1"] { font-size:22px; padding-right:40px; } .home-intro [data-k="heroIntroLine2"] { font-size:14px; padding-left:50px; margin-top:12px; } }
/* A modestly larger entry row with more readable labels. */
.home-page .home-portals { width:min(620px,88vw); max-width:620px; }
.home-page .home-portal { padding:17px 18px; }
.home-page .home-portal strong { font-size:22px; }
.home-page .home-portal__desc { font-size:13px; }
.home-page .home-portal__link { font-size:14px; }
@media(max-width:640px) { .home-page .home-portals { width:90vw; } .home-page .home-portal,.home-page .home-portal.is-active { padding:14px 11px; min-height:148px; } .home-page .home-portal__link { font-size:12px; } }
/* Monochrome entry cards: title upper-left, enlarged icon upper-right. */
.home-page .home-portal,.home-page .home-portal.is-active { color:#fff; background:linear-gradient(140deg,#ffffff14,#00000048 75%); border-color:#ffffff60; box-shadow:inset 0 1px 0 #ffffff60,0 12px 30px #0003; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
.home-page .home-portal:hover,.home-page .home-portal.is-active:hover { color:#fff; background:linear-gradient(140deg,#ffffff28,#00000058 75%); border-color:#ffffffbb; }
.home-page .home-portal .home-portal__icon { position:absolute; right:16px; top:15px; width:42px; height:42px; margin:0; background:transparent; color:#fff; box-shadow:none; font-size:36px; }
.home-page .home-portal strong { margin:5px 48px 18px 0; line-height:1.4; }
.home-page .home-portal .home-portal__desc { margin:0 0 22px; line-height:1.6; }
@media(max-width:640px) { .home-page .home-portal .home-portal__icon { right:8px; top:12px; width:30px; height:30px; font-size:30px; } .home-page .home-portal strong { margin:3px 32px 32px 0; font-size:19px; } .home-page .home-portal .home-portal__icon svg { width:29px; height:29px; } }
.home-portal__icon svg { width:36px; height:36px; }
.home-page .home-portal .home-portal__link { color:#fff; background:transparent; border-top-color:#ffffff40; }
/* Text-only traveling light; no diffuse glow. */
.home-page .home-intro { isolation:isolate; }
.home-page .home-intro::before { content:none; }
.home-intro [data-k="heroIntroLine1"] { background:linear-gradient(110deg,#fff 20%,#fff 35%,#2684ff 45%,#fff 50%,#2684ff 55%,#fff 65%,#fff 80%); background-size:200% 100%; background-clip:text; -webkit-background-clip:text; color:transparent; -webkit-text-fill-color:transparent; animation:intro-light-sweep 2.2s linear infinite; filter:none; text-shadow:none; }
@keyframes intro-light-sweep { 0% { background-position:100% 50%; } 100% { background-position:0% 50%; } }
@keyframes intro-light-drift { from { transform:translateX(-5%) scale(.95); opacity:.5; } to { transform:translateX(5%) scale(1.06); opacity:1; } }
@media(prefers-reduced-motion:reduce) { .home-page .home-intro::before,.home-intro [data-k="heroIntroLine1"] { animation:none; } }
/* 手机端（含 iOS Safari）：background-clip:text 配合渐变动画时，WebKit 会把渐变当成元素的背景层画出来，
   在文字盒子的上下左右露出约 1px 的亮边——就是首页标题旁那条细线。小屏直接换成纯色，桌面端保留流动光效。 */
@media (max-width: 768px) {
  .home-intro [data-k="heroIntroLine1"] { background:none; color:#fff; -webkit-text-fill-color:#fff; animation:none; }
}
