*{box-sizing:border-box}
:root{--bg:#f7f6f2;--fg:#1d1d1f;--mut:#5f6368;--card:#fff;--line:#e3e1da;--acc:#1f6f5c;--warn:#a15c00;--warnbg:#fff4e0}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Noto Sans SC",sans-serif;line-height:1.7;font-size:16px}
a{color:var(--acc)}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
header.hero{padding:64px 0 40px;border-bottom:1px solid var(--line)}
.hero h1{font-size:40px;margin:0 0 8px;letter-spacing:1px}
.hero p.lead{font-size:20px;margin:0 0 24px;color:var(--mut)}
.btn{display:inline-block;padding:10px 18px;border-radius:8px;border:1px solid var(--acc);text-decoration:none;margin:0 8px 8px 0;font-weight:600}
.btn.solid{background:var(--acc);color:#fff}
section{padding:40px 0}
h2{font-size:26px;margin:0 0 6px}
.sub{color:var(--mut);margin:0 0 24px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.cover{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;color:#fff;position:relative;text-align:center;padding:12px}
.cover img{width:100%;height:100%;object-fit:cover;display:block}
.cover.img{padding:0;background:#0f1724}
.c1{background:linear-gradient(135deg,#8a5a44,#3d5a80)}
.c2{background:linear-gradient(135deg,#243b55,#141e30)}
.c3{background:linear-gradient(135deg,#2c5364,#0f2027)}
.c4{background:linear-gradient(135deg,#4b8b3b,#2d5a27)}
.c5{background:linear-gradient(135deg,#5c4b3a,#2b2420)}
.tag{position:absolute;top:10px;left:10px;font-size:13px;font-weight:700;padding:2px 10px;border-radius:999px}
.tag.fix{background:var(--warnbg);color:var(--warn)}
.tag.ok{background:#e3f4ee;color:var(--acc)}
.tag.sample{background:#eef0ff;color:#3b46a8}
.body{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column}
.body h3{margin:0 0 6px;font-size:19px}
.body p{margin:0 0 8px}
dl{margin:0 0 12px;display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:14px;color:var(--mut)}
dt{font-weight:600}dd{margin:0}
.note{font-size:14px;background:var(--warnbg);color:#6b4100;border-radius:8px;padding:8px 10px;margin:0 0 12px}
.act{margin-top:auto}
.act .btn{margin:0;font-size:15px;padding:8px 14px}
.act .off{display:inline-block;padding:8px 14px;border-radius:8px;border:1px dashed var(--line);color:var(--mut);font-size:15px}
ul.jobs{padding-left:20px;margin:0}
ul.jobs li{margin:4px 0}
.contact{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
.contact a{font-size:20px;font-weight:600;word-break:break-all}
footer{border-top:1px solid var(--line);padding:24px 0 40px;color:var(--mut);font-size:14px}
article.doc{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:24px;margin:24px 0}
article.doc table{border-collapse:collapse;width:100%;display:block;overflow-x:auto;font-size:14px}
article.doc th,article.doc td{border:1px solid var(--line);padding:6px 8px;vertical-align:top}
article.doc a{word-break:break-all}
@media (max-width:600px){
 .hero h1{font-size:30px}.hero p.lead{font-size:17px}
 header.hero{padding:40px 0 28px}
 .grid{grid-template-columns:1fr}
 article.doc{padding:16px}
}
.media{aspect-ratio:16/9;background:#0f1117;position:relative}
.media video,.media img.cv{width:100%;height:100%;object-fit:cover;display:block}
.media .tag{z-index:2}
.media video.nc{cursor:pointer}
.vbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:auto}
.vbar button{font:inherit;font-size:15px;padding:7px 14px;border-radius:8px;border:1px solid var(--acc);background:#fff;color:var(--acc);font-weight:600;cursor:pointer}
.vbar button.solid{background:var(--acc);color:#fff}
.vbar .tip{font-size:13px;color:var(--mut)}