/* YOS 作品墙样式 —— 沿用官网的暗底金色 */
:root{
  --bg:#0d0c0a; --bg2:#15130f; --ink:#f3ede2; --sub:#a39b8c; --faint:#6f685d; --line:#2c2821; --line2:#4a4337;
  --gold:#e3b066; --gold2:#f6d9a6; --ember:#e0613a;
  --serif:"Fraunces",Georgia,"Songti SC","Noto Serif SC",serif;
  --sans:"Manrope",-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
img{display:block;max-width:100%}
::selection{background:var(--gold);color:#1a1206}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--gold);color:#000;padding:8px 14px;z-index:200}
.skip:focus{left:12px}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}

/* 顶栏：品牌 | 语言 */
.bar{display:flex;align-items:center;gap:28px;padding:20px 0 16px;border-bottom:1px solid var(--line2)}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:700;font-size:22px;letter-spacing:.06em;text-decoration:none}
.brand i{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--gold2),var(--gold) 45%,var(--ember));box-shadow:0 0 16px rgba(227,176,102,.55)}
.bar .yos-lang{margin-left:auto}
.yos-lang{min-width:48px;min-height:44px;padding:0 14px;border:1px solid var(--line2);border-radius:999px;font-size:14px;font-weight:600;color:var(--ink);transition:border-color .15s}
.yos-lang:hover{border-color:var(--gold)}

/* 开头：左标题 · 右巨号 */
header.hero{padding:64px 0 52px;display:grid;grid-template-columns:1fr auto;gap:20px 48px;align-items:start}
.eyebrow{grid-column:1/-1;font-size:12px;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:-4px}
h1{font-family:var(--serif);font-weight:600;font-size:clamp(36px,5.6vw,76px);line-height:1.05;letter-spacing:-.02em;max-width:15em}
h1 em{font-style:italic;color:var(--sub);font-weight:400}
.bignum{text-align:right;line-height:1;padding-top:6px}
.bignum .n{font-family:var(--serif);font-size:clamp(64px,10vw,150px);font-weight:600;letter-spacing:-.04em;color:var(--gold2)}
.bignum .l{display:block;margin-top:10px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--sub)}
.sub{grid-column:1;color:var(--sub);font-size:16px;max-width:46ch;line-height:1.75}
.sub b{color:var(--ink)}

/* 筛选栏：吸顶 */
nav.tabs{position:sticky;top:0;z-index:5;background:var(--bg);border-top:1px solid var(--line2);border-bottom:1px solid var(--line);display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;align-items:center;box-shadow:-32px 0 0 var(--bg),32px 0 0 var(--bg)}
nav.tabs::-webkit-scrollbar{display:none}
.tab{font-size:14px;letter-spacing:.04em;color:var(--sub);border-bottom:2px solid transparent;padding:14px 2px 12px;min-height:48px;white-space:nowrap;transition:color .15s}
.tab:hover{color:var(--ink)}
.tab[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--gold);font-weight:700}
.tab .n{color:var(--faint);margin-left:5px;font-size:12px;font-weight:400}

/* 卡片进场 */
.reveal{opacity:0;transform:translateY(14px)}
.reveal.in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s ease}
.empty{color:var(--sub);padding:80px 0;grid-column:1/-1;font-size:15px}

/* 收口：左文案 + 按钮，右描边「下一个编号」 */
.cta{border-top:1px solid var(--line2);margin-top:80px;padding:80px 0 88px;display:grid;grid-template-columns:1fr auto;gap:24px 48px;align-items:center}
.cta h2{font-family:var(--serif);font-weight:600;font-size:clamp(30px,4.2vw,54px);letter-spacing:-.02em;line-height:1.1;max-width:16em}
.cta h2 em{font-style:italic;color:var(--sub);font-weight:400}
.ctarow{display:flex;align-items:center;gap:22px;margin-top:34px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;padding:0 30px;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;color:#1a1206;background:linear-gradient(135deg,var(--gold2),var(--gold) 55%,#c98b3d);box-shadow:0 10px 30px -12px rgba(227,176,102,.6);transition:transform .15s,filter .15s}
.btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.btn.ghost{background:none;color:var(--ink);border:1px solid var(--line2);box-shadow:none}
.btn.ghost:hover{border-color:var(--gold)}
.ctanote{font-size:14px;color:var(--sub)}
.nextnum{text-align:right;line-height:1}
.nextnum .n{font-family:var(--serif);font-size:clamp(80px,12vw,180px);font-weight:600;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px #5a5144}
.nextnum .l{display:block;margin-top:8px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--faint)}

footer{border-top:1px solid var(--line2);padding:26px 0 44px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.fbrand{font-size:14px;color:var(--sub)}
.fbrand a{color:var(--ink);font-weight:700;text-decoration:none}
.fbrand a:hover{text-decoration:underline}
.fnote{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}

.yos-toast{position:fixed;left:50%;bottom:calc(28px + env(safe-area-inset-bottom));z-index:90;transform:translate(-50%,16px);max-width:min(92vw,560px);background:var(--ink);color:#14100d;font-size:14px;font-weight:600;padding:12px 18px;border-radius:12px;opacity:0;transition:.25s;pointer-events:none;text-align:center}
.yos-toast.on{opacity:1;transform:translate(-50%,0)}

@media(max-width:760px){
  .wrap{padding:0 16px}
  .bar{gap:14px}
  header.hero{padding:36px 0 28px;grid-template-columns:1fr auto;gap:12px 16px}
  h1{font-size:32px}
  .bignum .n{font-size:52px}.bignum .l{font-size:10px;letter-spacing:.16em}
  .sub{grid-column:1/-1;font-size:15px}
  nav.tabs{gap:20px;box-shadow:-16px 0 0 var(--bg),16px 0 0 var(--bg)}
  .cta{padding:56px 0 64px;grid-template-columns:1fr}
  .nextnum{text-align:left}.nextnum .n{font-size:72px}
}
@media(max-width:420px){.brand{font-size:19px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}}
/* 中文没有真斜体，强调改用颜色 */
:lang(zh) h1 em,:lang(zh) .cta h2 em{font-style:normal}
