:root{
  --bg-base:#0A0B10;
  --bg-surface:#12141C;
  --bg-surface-raised:#1A1D28;
  --text-primary:#E8EAF0;
  --text-secondary:#9BA1B0;
  --neon-primary:#00E5FF;
  --neon-primary-2:#4DA6FF;
  --neon-secondary:#B845FF;
  --border-subtle:rgba(255,255,255,0.10);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg-base);
  color:var(--text-primary);
  font-family:'Noto Sans JP','Manrope',-apple-system,BlinkMacSystemFont,sans-serif;
  min-height:100vh;
  display:flex;
  justify-content:center;
  padding:48px 20px 80px;
  line-height:1.8;
}
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background-image:
    linear-gradient(rgba(0,229,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,229,255,0.05) 1px, transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse 60% 50% at 50% 0%, black 30%, transparent 75%);
}
.wrap{ width:100%; max-width:680px; }
.brand{ display:flex; align-items:center; gap:14px; margin-bottom:20px; }
.brand img{ width:44px; height:44px; border-radius:12px; box-shadow:0 0 20px rgba(0,229,255,0.3); }
.brand .name{ font-weight:700; font-size:15.5px; }

nav.crumbs{ display:flex; gap:18px; margin-bottom:36px; flex-wrap:wrap; }
nav.crumbs a{ color:var(--text-secondary); font-size:13px; text-decoration:none; border-bottom:1px solid transparent; }
nav.crumbs a:hover{ color:var(--neon-primary); border-bottom-color:var(--neon-primary); }
nav.crumbs a.active{ color:var(--neon-primary); }

h1{
  font-size:26px; font-weight:700; margin:0 0 6px;
  background:linear-gradient(135deg, var(--neon-primary), var(--neon-primary-2));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.updated{ color:var(--text-secondary); font-size:12.5px; margin:0 0 32px; }

.panel{
  background:rgba(26,29,40,0.55);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  border:1px solid var(--border-subtle);
  border-radius:24px;
  padding:36px 32px;
}
.panel h2{ font-size:16px; font-weight:700; margin:32px 0 10px; color:var(--text-primary); }
.panel h2:first-child{ margin-top:0; }
.panel p, .panel li{ font-size:14px; color:var(--text-secondary); }
.panel strong{ color:var(--text-primary); }
.panel ul, .panel ol{ padding-left:1.3em; margin:8px 0; }
.panel li{ margin-bottom:6px; }
.panel a{ color:var(--neon-primary); }
.panel table{ width:100%; border-collapse:collapse; margin:12px 0; font-size:13px; }
.panel th, .panel td{ text-align:left; padding:8px 10px; border-bottom:1px solid var(--border-subtle); color:var(--text-secondary); vertical-align:top; }
.panel th{ color:var(--text-primary); font-weight:600; }

footer{ margin-top:28px; text-align:center; color:#5B6172; font-size:12px; line-height:1.8; }
footer a{ color:var(--text-secondary); }
