css
ai {
  --bg-0:#1a1419; --bg-1:#241820; --bg-2:#2d1f28; --bg-3:#3a2832;
  --card:#2a1e26; --card-2:#352530;
  --blood:#e63946; --blood-bright:#ff4d6d; --blood-deep:#a4161a;
  --warn:#ffb700; --term:#7dff5e; --cyber:#4cc9f0;
  --ink:#f5e6e8; --ink-2:#c9b8bc; --ink-3:#8a7479;
  --hl:#ff7a8a; --gold:#e8b04b;
  --line:rgba(230,57,70,.25);
  --tape:repeating-linear-gradient(45deg,#ffb700 0 14px,#1a1419 14px 28px);
  display:block; position:relative;
  background:
    radial-gradient(ellipse at 20% 0%,rgba(230,57,70,.18),transparent 55%),
    radial-gradient(ellipse at 80% 100%,rgba(76,201,240,.08),transparent 55%),
    linear-gradient(180deg,var(--bg-1),var(--bg-0));
  color:var(--ink);
  font-family:"Hiragino Sans","Microsoft YaHei",ui-sans-serif,sans-serif;
  font-size:14px; line-height:1.7;
  padding:14px 12px 18px; margin:8px 0;
  border:1px solid var(--blood-deep);
  border-radius:3px;
  box-shadow:
    0 0 0 1px rgba(230,57,70,.2) inset,
    0 0 28px rgba(230,57,70,.15),
    0 8px 36px rgba(0,0,0,.55);
  overflow:hidden;
}
ai::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><text x='10' y='40' font-size='14' fill='%23ff4d6d' fill-opacity='0.08' font-family='monospace'>TARGET//ACQUIRED</text><text x='30' y='95' font-size='12' fill='%23ffb700' fill-opacity='0.09' font-family='monospace'>狩猟活性 //LV.∞</text><text x='5' y='160' font-size='15' fill='%234cc9f0' fill-opacity='0.07' font-family='monospace'>渋谷区 03-XXXX</text><text x='40' y='220' font-size='10' fill='%23f5e6e8' fill-opacity='0.06' font-family='monospace'>MPD//SCU//警視庁</text><path d='M0 65 L260 65 M0 190 L260 190' stroke='%23ff4d6d' stroke-opacity='0.08' stroke-width='1'/></svg>");
  mix-blend-mode:screen;
}
ai::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.025) 2px 3px);
  opacity:.6;
  animation:scn 8s linear infinite;
}
@keyframes scn{from{background-position:0 0}to{background-position:0 60px}}

ai details{
  position:relative; margin:10px 0;
  background:linear-gradient(180deg,var(--card),var(--card-2));
  border:1px solid rgba(230,57,70,.4);
  border-left:3px solid var(--blood);
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));
  padding:0 12px 12px;
  transition:.3s;
  box-shadow:inset 0 0 24px rgba(0,0,0,.3);
}
ai details:hover{
  border-color:var(--blood-bright);
  box-shadow:
    inset 0 0 24px rgba(0,0,0,.3),
    0 0 22px rgba(255,77,109,.25);
}
ai details::before{
  content:""; position:absolute; top:0; right:0; width:44px; height:2px;
  background:var(--blood-bright); box-shadow:0 0 10px var(--blood-bright);
}

ai summary{
  list-style:none; cursor:pointer;
  font-size:13px; font-weight:700; letter-spacing:.2em;
  color:#ffe4ea;
  padding:11px 4px 9px 14px; margin:0 -12px 10px;
  border-bottom:1px solid rgba(230,57,70,.35);
  text-shadow:0 0 8px rgba(255,77,109,.6),0 1px 0 rgba(0,0,0,.4);
  text-transform:uppercase;
  display:flex; align-items:center; gap:8px;
  background:linear-gradient(90deg,rgba(230,57,70,.35),rgba(230,57,70,.05) 70%,transparent);
}
ai summary::-webkit-details-marker{display:none}
ai summary::before{
  content:"▼"; font-size:10px; color:var(--blood-bright);
  transition:.3s; display:inline-block;
  filter:drop-shadow(0 0 4px var(--blood-bright));
}
ai details:not([open]) summary::before{transform:rotate(-90deg)}
ai summary::after{
  content:"// MPD-SCU"; margin-left:auto; font-size:9.5px;
  color:var(--warn); opacity:.85; letter-spacing:.12em; font-weight:600;
  text-shadow:0 0 4px rgba(255,183,0,.4);
}

ai grid{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:6px 10px; padding:4px 2px;
}
ai grid d{
  display:flex; align-items:baseline; gap:6px;
  padding:5px 9px;
  background:linear-gradient(90deg,rgba(230,57,70,.1),rgba(0,0,0,.2));
  border-left:2px solid var(--blood);
  font-size:13px;
}

ai d{display:block; margin:3px 0; padding:2px 0; font-size:13px; color:var(--ink)}
ai sec{display:block; margin:10px 0 6px; padding:6px 4px 4px; position:relative}
ai sec::before{
  content:"▸ " attr(t);
  display:block; font-size:11.5px; font-weight:800;
  color:var(--warn); letter-spacing:.18em;
  padding:4px 10px; margin:0 -4px 7px;
  background:linear-gradient(90deg,rgba(255,183,0,.18),transparent 70%);
  border-bottom:1px solid rgba(255,183,0,.3);
  text-transform:uppercase;
  text-shadow:0 0 6px rgba(255,183,0,.4);
}

ai sec d{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px;
  padding:5px 10px; margin:3px 0;
  background:rgba(0,0,0,.3);
  border-left:1px solid rgba(230,57,70,.3);
  transition:.2s;
}
ai sec d:hover{
  background:rgba(230,57,70,.12);
  border-left-color:var(--blood-bright);
}

ai k{
  color:var(--gold); font-size:11.5px; letter-spacing:.12em;
  font-weight:700; min-width:fit-content;
  text-transform:uppercase;
  text-shadow:0 0 3px rgba(232,176,75,.3);
}
ai k::after{content:"："; color:var(--blood)}
ai v{color:var(--ink); font-size:13.5px; flex:1; font-weight:500}

ai lv, ai tg{
  display:inline-block; padding:2px 9px;
  font-size:11px; font-weight:800; letter-spacing:.1em;
  border:1px solid currentColor;
  clip-path:polygon(0 0,calc(100% - 5px) 0,100% 5px,100% 100%,5px 100%,0 calc(100% - 5px));
  text-shadow:0 0 4px currentColor;
}
ai lv[x="低"], ai tg[x="低"], ai tg[x="弱"], ai tg[x="无名"]{color:#b8a4a8; background:rgba(184,164,168,.12)}
ai lv[x="中"], ai tg[x="中"], ai tg[x="有名"], ai tg[x="试探"], ai tg[x="警惕"]{color:var(--warn); background:rgba(255,183,0,.15)}
ai lv[x="高"], ai tg[x="高"], ai tg[x="强"], ai tg[x="勇者"], ai tg[x="敌意"]{color:#ff8c42; background:rgba(255,140,66,.15)}
ai lv[x="狂热"], ai tg[x="传说"], ai tg[x="爱慕"]{
  color:#fff; background:var(--blood);
  border-color:var(--blood-bright);
  animation:pulse 1.6s ease-in-out infinite;
  text-shadow:0 0 6px #fff;
}
ai tg[x="未知"]{color:var(--cyber); background:rgba(76,201,240,.12)}
ai tg[x="中立"], ai tg[x="依赖"]{color:var(--term); background:rgba(125,255,94,.1)}
@keyframes pulse{
  0%,100%{box-shadow:0 0 4px var(--blood-bright),inset 0 0 4px rgba(255,255,255,.3)}
  50%{box-shadow:0 0 16px var(--blood-bright),inset 0 0 10px rgba(255,77,109,.5)}
}

ai bar{
  position:relative; display:inline-block; min-width:150px; height:15px;
  background:rgba(0,0,0,.55);
  border:1px solid rgba(230,57,70,.5);
  overflow:hidden; vertical-align:middle;
  box-shadow:inset 0 0 4px rgba(0,0,0,.6);
}
ai bar::before{
  content:""; position:absolute; left:0; top:0; bottom:0;
  width:60%;
  background:linear-gradient(90deg,var(--blood-deep),var(--blood),var(--blood-bright));
  box-shadow:0 0 10px var(--blood-bright);
  animation:flow 2.5s ease-in-out infinite;
}
ai bar::after{
  content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(90deg,transparent 0 8px,rgba(0,0,0,.35) 8px 9px);
}
ai bar v{
  position:relative; z-index:2; display:block; text-align:center;
  font-size:10.5px; line-height:15px; font-weight:800;
  color:#fff; text-shadow:0 0 4px #000,0 0 2px var(--blood-deep);
  letter-spacing:.05em;
}
@keyframes flow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}

ai q{
  display:block; font-style:italic;
  color:var(--hl); font-size:13px;
  padding:6px 12px; margin:5px 0;
  border-left:3px solid var(--blood);
  background:linear-gradient(90deg,rgba(230,57,70,.12),transparent 80%);
  position:relative;
}
ai q::before{content:"「"; color:var(--blood-bright); font-weight:700; margin-right:2px; font-size:1.1em}
ai q::after{content:"」"; color:var(--blood-bright); font-weight:700; margin-left:2px; font-size:1.1em}

ai d[hide] v, ai d[nsfw] v{
  filter:blur(4px) brightness(.7); transition:.4s; cursor:pointer;
}
ai d[hide]:hover v, ai d[nsfw]:hover v{filter:blur(0) brightness(1)}
ai d[hide]::after{content:" // CLASSIFIED"; color:var(--blood-bright); font-size:9.5px; letter-spacing:.12em; opacity:.85; font-weight:700}
ai d[nsfw]::after{content:" // 18+"; color:var(--hl); font-size:9.5px; letter-spacing:.12em; opacity:.85; font-weight:700}
ai d[warn]{
  border:1px solid var(--warn) !important;
  background:var(--tape) !important;
  background-size:200% 200% !important;
  animation:warn 3s linear infinite;
  padding:7px 10px;
}
ai d[warn] v{background:rgba(26,20,25,.92); padding:3px 8px; color:var(--warn); font-weight:800; text-shadow:0 0 4px rgba(255,183,0,.5)}
@keyframes warn{from{background-position:0 0}to{background-position:56px 0}}

ai own{
  display:block; position:relative;
  padding:11px 12px 11px 56px; margin:6px 0;
  background:
    linear-gradient(135deg,rgba(164,22,26,.35),rgba(45,31,40,.7)),
    linear-gradient(180deg,var(--card),var(--card-2));
  border:1px solid rgba(230,57,70,.55);
  border-left:3px solid var(--blood-bright);
  box-shadow:inset 0 0 16px rgba(0,0,0,.4);
}
ai own::before{
  content:""; position:absolute; left:12px; top:50%; transform:translateY(-50%);
  width:34px; height:34px; border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%,var(--blood-bright),var(--blood-deep) 70%);
  border:2px solid var(--blood-bright);
  box-shadow:0 0 10px var(--blood-bright),inset 0 0 6px rgba(0,0,0,.5);
}
ai own::after{
  content:"⛓"; position:absolute; left:36px; top:6px;
  color:var(--gold); font-size:15px;
  text-shadow:0 0 6px var(--gold);
}
ai own n{
  display:block; font-weight:800; color:var(--hl);
  font-size:14.5px; letter-spacing:.06em;
  border-bottom:1px dotted rgba(255,122,138,.35); padding-bottom:4px; margin-bottom:5px;
  text-shadow:0 0 4px rgba(255,122,138,.4);
}

ai tbl{
  display:table; width:100%; margin:6px 0;
  border-collapse:collapse; font-size:12.5px;
}
ai tbl tr{display:table-row}
ai tbl th, ai tbl td{
  display:table-cell; padding:6px 9px;
  border:1px solid rgba(230,57,70,.3);
}
ai tbl th{
  background:linear-gradient(180deg,rgba(230,57,70,.4),rgba(230,57,70,.15));
  color:#ffe4ea; font-size:11px; letter-spacing:.12em; font-weight:800;
  text-shadow:0 0 4px rgba(255,77,109,.5);
}
ai tbl td{background:rgba(0,0,0,.35); color:var(--ink)}
ai tbl tr:hover td{background:rgba(230,57,70,.15)}

ai post{
  display:block; padding:9px 12px; margin:5px 0;
  background:
    repeating-linear-gradient(0deg,transparent 0 2px,rgba(125,255,94,.03) 2px 3px),
    linear-gradient(180deg,rgba(45,31,40,.6),rgba(26,20,25,.7));
  border:1px solid rgba(125,255,94,.18);
  border-left:2px solid var(--term);
  font-size:12.5px;
}
ai post tl{
  display:block; color:var(--hl); font-weight:800; font-size:13.5px;
  text-shadow:0 0 5px rgba(255,122,138,.5);
}
ai post sub{
  display:block; color:var(--term); font-family:monospace; font-size:11px;
  margin:3px 0; letter-spacing:.06em;
  text-shadow:0 0 4px rgba(125,255,94,.4);
}

ai head{
  display:flex; gap:10px; align-items:center;
  padding:7px 12px; margin:4px -12px 10px;
  background:linear-gradient(90deg,rgba(230,57,70,.3),transparent 80%);
  border-bottom:1px solid var(--blood-deep);
  font-size:12.5px;
}

ai mm{
  display:block; padding:7px 11px; margin:4px 0;
  background:linear-gradient(90deg,rgba(76,201,240,.06),rgba(0,0,0,.35));
  border-left:2px solid var(--cyber);
  position:relative;
}
ai mm i{
  display:inline-block; color:var(--cyber); font-style:normal;
  font-family:monospace; font-weight:800; font-size:11px;
  background:rgba(76,201,240,.15); padding:1px 6px; margin-right:7px;
  text-shadow:0 0 4px rgba(76,201,240,.4);
}
ai mm tm{color:var(--warn); font-size:11px; letter-spacing:.08em; margin-right:7px; font-weight:700}
ai mm v{color:var(--ink); font-size:13px}

ai act{
  display:flex; align-items:center; gap:11px;
  padding:9px 14px; margin:5px 0;
  background:linear-gradient(90deg,rgba(230,57,70,.25),rgba(45,31,40,.5) 75%);
  border:1px solid rgba(230,57,70,.4);
  border-left:3px solid var(--blood);
  cursor:pointer; transition:.25s;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,0 100%);
}
ai act:hover{
  background:linear-gradient(90deg,rgba(230,57,70,.45),rgba(45,31,40,.5));
  border-left-color:var(--blood-bright);
  transform:translateX(4px);
  box-shadow:-4px 0 14px rgba(255,77,109,.35);
}
ai act n{
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; flex-shrink:0;
  background:linear-gradient(135deg,var(--blood-bright),var(--blood-deep));
  color:#fff;
  font-weight:900; font-size:13.5px; font-family:monospace;
  border:1px solid var(--blood-bright);
  box-shadow:0 0 8px var(--blood-bright),inset 0 0 4px rgba(255,255,255,.3);
  text-shadow:0 0 4px rgba(0,0,0,.6);
}
ai act v{color:#ffe4ea; font-size:13.8px; letter-spacing:.02em; font-weight:600}

ai art{
  display:block; margin:14px 0; padding:18px 18px 16px;
  background:
    repeating-linear-gradient(0deg,transparent 0 2px,rgba(255,255,255,.02) 2px 3px),
    linear-gradient(180deg,rgba(45,31,40,.85),rgba(36,24,32,.85));
  border:1px solid rgba(230,57,70,.3);
  border-left:3px solid var(--blood);
  position:relative;
  box-shadow:inset 0 0 28px rgba(0,0,0,.4);
}
ai art::before{
  content:"// 観測記録 OBSERVATION"; position:absolute; top:-10px; left:16px;
  background:var(--bg-0); padding:2px 10px;
  color:var(--blood-bright); font-size:10.5px; letter-spacing:.22em; font-weight:800;
  text-shadow:0 0 6px rgba(255,77,109,.5);
  border:1px solid rgba(230,57,70,.4);
}
ai art::after{
  content:"END // LOG"; position:absolute; bottom:-10px; right:16px;
  background:var(--bg-0); padding:2px 10px;
  color:var(--warn); font-size:10.5px; letter-spacing:.22em; font-weight:800;
  text-shadow:0 0 6px rgba(255,183,0,.4);
  border:1px solid rgba(255,183,0,.3);
}
ai art p{
  margin:0; padding:9px 0;
  font-size:14.5px; line-height:1.9;
  color:#fce8ec;
  text-indent:2em;
  position:relative;
  text-shadow:0 1px 2px rgba(0,0,0,.7),0 0 1px rgba(0,0,0,.5);
  font-weight:500;
}
ai art p:first-child::first-letter{
  font-size:2.6em; float:left; line-height:.9;
  padding:5px 9px 0 0; color:#ff7a8a;
  text-shadow:0 0 12px rgba(255,77,109,.7),0 2px 3px rgba(0,0,0,.6);
  font-weight:900;
}

ai strong{color:var(--hl); font-weight:800; text-shadow:0 0 4px rgba(255,122,138,.4)}
ai em, ai i{color:var(--warn); font-style:italic; text-shadow:0 0 3px rgba(255,183,0,.3)}

@media (max-width:480px){
  ai{font-size:13px; padding:10px 8px}
  ai grid{grid-template-columns:1fr 1fr}
  ai summary{font-size:12px; letter-spacing:.14em}
  ai summary::after{font-size:8.5px}
  ai art{padding:14px 12px}
  ai art p{font-size:13.8px; line-height:1.85}
  ai tbl{font-size:11px}
  ai tbl th, ai tbl td{padding:4px 6px}
  ai own{padding-left:50px}
  ai own::before{width:30px; height:30px; left:10px}
}