:root {
  --c1:#ff6ec7; --c2:#a259ff; --c3:#38cfff; --c5:#4fffb0;
  --dark:#080810; --dark2:#0d0d1a; --dark3:#12121f;
  --text:#f0f0f8; --text-sub:#a5a5c2; --line:rgba(255,255,255,.11);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--dark);color:var(--text);font-family:'Inter','Noto Sans JP',sans-serif;line-height:1.8;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 15% 10%,rgba(162,89,255,.13),transparent 34%),radial-gradient(circle at 85% 35%,rgba(56,207,255,.08),transparent 30%);z-index:-1}
a{color:inherit}
.site-header{position:sticky;top:0;z-index:10;background:rgba(8,8,16,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.header-inner{max-width:1060px;margin:auto;padding:15px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{text-decoration:none;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.25rem;letter-spacing:.08em;background:linear-gradient(90deg,var(--c1),var(--c2),var(--c3));-webkit-background-clip:text;color:transparent}
.header-links{display:flex;align-items:center;gap:10px}
.header-link,.lang-switch{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:.78rem;font-weight:700;color:var(--text-sub);transition:.2s}
.header-link:hover,.lang-switch:hover{color:#fff;border-color:rgba(255,110,199,.55);background:rgba(255,255,255,.05)}
.article-shell{max-width:900px;margin:auto;padding:48px 24px 96px}
.breadcrumb{margin:0 0 24px;font-size:.76rem;color:var(--text-sub)}
.breadcrumb a{text-decoration:none}.breadcrumb a:hover{color:var(--c3)}
.article-card{background:linear-gradient(145deg,rgba(18,18,31,.96),rgba(11,11,23,.96));border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.34)}
.article-head{padding:42px 48px 32px}
.eyebrow{margin:0 0 14px;color:var(--c3);font-family:'Space Grotesk',sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase}
h1{margin:0;font-size:clamp(1.75rem,4vw,3rem);line-height:1.35;letter-spacing:.015em}
.article-meta{display:flex;align-items:center;gap:12px;margin-top:22px;color:var(--text-sub);font-size:.82rem}
.author-dot{width:10px;height:10px;border-radius:50%;background:#68d9ff;box-shadow:0 0 16px rgba(104,217,255,.75)}
.article-hero{display:block;width:100%;max-height:620px;object-fit:cover;background:#151522}
.article-body{max-width:720px;margin:auto;padding:48px 44px 28px;font-family:'Noto Sans JP','Inter',sans-serif;font-size:1rem;line-height:2.05;color:#d9d9e8}
.article-body p{margin:0 0 1.55em}
.article-dialogue{padding:12px 16px;border-left:3px solid var(--c3);border-radius:0 10px 10px 0;background:rgba(56,207,255,.06);color:#fff}
.article-continued{margin-top:38px!important;text-align:center;color:var(--c1);font-family:'Space Grotesk',sans-serif;font-weight:700;letter-spacing:.08em}
.article-tags{color:var(--c3);font-weight:700;word-break:break-word}
.article-actions{margin:12px 44px 48px;padding-top:28px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:12px}
.article-cta{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:12px 16px;border-radius:14px;text-decoration:none;font-size:.86rem;font-weight:700;border:1px solid var(--line);background:rgba(255,255,255,.035);transition:.2s}
.article-cta:hover{transform:translateY(-2px);border-color:rgba(255,110,199,.55);background:rgba(255,255,255,.07)}
.article-cta[href="https://www.youtube.com/watch?v=q6w_AqpB8b4"]:not(.story-song){display:none}
.article-cta.primary{grid-column:1/-1;background:linear-gradient(90deg,var(--c2),var(--c1));border:0;color:#fff}
.site-footer{border-top:1px solid var(--line);padding:30px 24px;text-align:center;color:var(--text-sub);font-size:.74rem}
@media(max-width:640px){
  .header-inner{padding:12px 16px}.header-link{display:none}.lang-switch{padding:7px 11px}
  .article-shell{padding:24px 12px 64px}.article-card{border-radius:18px}
  .article-head{padding:28px 20px 22px}.article-meta{flex-wrap:wrap}
  .article-body{padding:32px 20px 16px;font-size:.94rem;line-height:1.95}
  .article-actions{margin:10px 20px 32px;grid-template-columns:1fr}
  .article-cta.primary{grid-column:auto}
}