:root{
  --bg:#070707;--panel:#121212;--text:#f2f2f2;--muted:#999;
  --red:#b32130;--line:#351419
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;color:var(--text);
  background:radial-gradient(circle at top,rgba(125,0,16,.16),transparent 34%),#070707;
  font-family:"Yu Gothic","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif
}
header{text-align:center;padding:70px 20px 48px;border-bottom:1px solid var(--line)}
.kicker{color:var(--red);font-size:11px;letter-spacing:.32em;margin:0 0 12px}
h1{font-family:Georgia,"Times New Roman",serif;font-weight:500;letter-spacing:.09em;margin:0;font-size:clamp(28px,6vw,52px)}
.jp{color:#aaa;margin-top:12px;letter-spacing:.14em;font-size:13px}
main{width:min(1000px,calc(100% - 32px));margin:auto;padding:42px 0 75px}
.lead{text-align:center;color:#aaa;line-height:1.9;margin:0 auto 36px;max-width:700px;font-size:14px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:17px}
.card{display:block;text-decoration:none;color:inherit;background:linear-gradient(145deg,#171717,#0e0e0e);border:1px solid #292929;border-left:3px solid #74121c;border-radius:7px;padding:26px;transition:.18s}
.card:hover{transform:translateY(-2px);border-color:#6f2028}
.en{color:var(--red);font-family:Georgia,"Times New Roman",serif;font-size:12px;letter-spacing:.15em}
.card h2{font-family:Georgia,"Yu Gothic",serif;margin:10px 0 10px;font-weight:500;font-size:23px}
.card p{color:var(--muted);font-size:13px;line-height:1.75;margin:0}
.arrow{display:block;margin-top:20px;color:#ccc;font-size:12px}
.topbar{width:min(1000px,calc(100% - 32px));margin:22px auto 0}
.back{color:#aaa;text-decoration:none;font-size:12px}
.back:hover{color:#fff}
.list{display:grid;gap:12px}
.work{display:block;text-decoration:none;color:#eee;padding:19px 21px;background:#111;border:1px solid #292929;border-radius:5px;transition:.18s}
.work:hover{background:#171717;border-color:#6c2028;transform:translateY(-1px)}
.work-title{font-size:15px;font-weight:600}
.work-meta{display:block;color:#777;font-size:11px;margin-top:7px}
.empty{padding:28px 20px;text-align:center;color:#666;border:1px dashed #333;border-radius:5px;font-size:13px}
footer{text-align:center;border-top:1px solid #181818;color:#555;padding:26px;font-size:10px;letter-spacing:.16em}
@media(max-width:520px){header{padding:52px 18px 38px}main{padding-top:32px}}