
:root{--bg:#0a0a0c;--fg:#f2f2f0;--mut:#8a8a92;--line:#232328;--acc:#c8ff00}
*{margin:0;box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN",sans-serif}
a{color:inherit;text-decoration:none}
header{position:sticky;top:0;background:rgba(10,10,12,.92);border-bottom:1px solid var(--line);z-index:10}
.nav{max-width:1200px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:28px}
.logo{font-weight:800;letter-spacing:.12em;font-size:15px}
.logo span{color:var(--acc)}
.nav a.item{font-size:12px;letter-spacing:.14em;color:var(--mut)}
.nav a.item:hover{color:var(--fg)}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.hero{padding:84px 0 60px}
.hero h1{font-size:clamp(34px,6vw,64px);line-height:1.04;font-weight:800}
.hero h1 em{font-style:normal;color:var(--acc)}
.hero p{margin-top:18px;color:var(--mut);max-width:640px;font-size:14px;line-height:1.8}
.badge{display:inline-block;margin-top:22px;border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-size:11px;letter-spacing:.1em;color:var(--mut)}
.badge b{color:var(--acc);font-weight:600}
.sec{padding:36px 0 8px}
.sec h2{font-size:13px;letter-spacing:.22em;color:var(--mut);font-weight:600}
.grid-w{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:18px;padding:18px 0 40px}
.wcard{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0f0f13;transition:.18s;display:block}
.wcard:hover{border-color:#3a3a44;transform:translateY(-2px)}
.wthumbs{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));height:220px;gap:2px}
.wthumbs{overflow:hidden}
.wthumbs > *{min-height:0;min-width:0;overflow:hidden}
.wthumbs .th{width:100%;height:100%;object-fit:cover;display:block;background:#17171c}
.wthumbs > *:first-child{grid-row:1/3}
.winfo{padding:16px 18px 18px}
.winfo h3{font-size:17px;font-weight:700}
.winfo p{margin-top:6px;color:var(--mut);font-size:12px;line-height:1.6;min-height:34px}
.wstats{margin-top:10px;display:flex;gap:14px;font-size:11px;color:var(--mut)}
.wstats b{color:var(--fg)}
.grid-a{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;padding:18px 0 60px}
.acard{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0f0f13;transition:.18s;display:block}
.acard:hover{border-color:#3a3a44;transform:translateY(-2px)}
.acard .th{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;background:#17171c}
.ainfo{padding:12px 14px}
.ainfo .t{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ainfo .a{margin-top:3px;font-size:11px;color:var(--mut)}
.crumb{padding:26px 0 4px;font-size:11px;letter-spacing:.14em;color:var(--mut);display:block}
.crumb:hover{color:var(--fg)}
.detail{display:grid;grid-template-columns:1.4fr 1fr;gap:36px;padding:24px 0 80px}
.detail .art .th{width:100%;border-radius:12px;border:1px solid var(--line);background:#17171c}
.detail h1{font-size:26px;font-weight:800;line-height:1.2}
.detail .by{margin-top:8px;color:var(--mut);font-size:13px}
.detail .by b{color:var(--fg)}
.detail .desc{margin-top:18px;font-size:13px;line-height:1.9;color:#c9c9cf;white-space:pre-wrap}
.chain{margin-top:26px;border:1px solid var(--line);border-radius:12px;padding:16px 18px;font-size:12px}
.chain h4{font-size:10px;letter-spacing:.2em;color:var(--mut);margin-bottom:10px}
.chain .row{display:flex;justify-content:space-between;padding:6px 0;border-top:1px solid var(--line);gap:12px}
.chain .row span:first-child{color:var(--mut)}
.chain .row span:last-child{font-family:ui-monospace,monospace;font-size:11px;overflow:hidden;text-overflow:ellipsis}
.cta{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap}
.btn{border-radius:999px;padding:11px 20px;font-size:12px;border:1px solid var(--line);display:inline-block}
.btn.p{background:var(--acc);color:#0a0a0c;font-weight:700;border-color:var(--acc)}
.btn:hover{border-color:#4a4a55}
footer{border-top:1px solid var(--line);color:var(--mut);font-size:11px;letter-spacing:.1em}
footer .wrap{padding:26px 24px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ph{background:#17171c}
.vph{background:#17171c;display:flex;align-items:center;justify-content:center;color:#8a8a92;font-size:11px;letter-spacing:.18em}
.vwrap{position:relative;display:block;overflow:hidden;background:#17171c}
.vwrap>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.vbadge{position:absolute;right:10px;bottom:10px;background:rgba(10,10,12,.75);color:#f2f2f0;border-radius:999px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-size:11px}
.err{opacity:.15}
.ed{position:absolute;top:10px;left:10px;background:rgba(10,10,12,.82);border:1px solid #33333d;color:#c8ff00;font-size:10px;letter-spacing:.14em;padding:4px 9px;border-radius:999px}
.acard{position:relative}
#lang{background:none;border:1px solid var(--line);border-radius:999px;color:var(--mut);font-size:11px;letter-spacing:.1em;padding:6px 13px;cursor:pointer}
#lang:hover{color:var(--fg);border-color:#4a4a55}
@media(max-width:820px){.detail{grid-template-columns:1fr}}
