:root{--stage:#0b0d1c;--curtain:#141834;--rim:#262b52;--spot:#f5eedc;--dim:#c8c6da;--gold:#ebc06a;--blue:#82a8ff;--green:#06c755;--body:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;--mono:"JetBrains Mono",ui-monospace,Menlo,monospace;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--stage);color:var(--spot);font-family:var(--body);font-size:16.5px;line-height:1.95;letter-spacing:.03em;font-weight:500;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--gold)}
.wrap{max-width:760px;margin:0 auto;padding-inline:20px}
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--stage) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--rim)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:10px;max-width:1080px}
.logo{display:flex;align-items:center;gap:10px;color:var(--spot);text-decoration:none;min-width:0}
.logo img{width:38px;height:38px;border-radius:9px;flex:none}
.logo b{display:block;font-weight:900;font-size:16.5px;line-height:1.2;white-space:nowrap;letter-spacing:.05em}
.logo small{display:block;font-size:11.5px;color:var(--gold);line-height:1.4}
.toplink{flex:none;color:var(--spot);text-decoration:none;border:1px solid var(--rim);border-radius:99px;padding:7px 14px;font-size:13px;font-weight:700}
.crumb{font-size:13px;color:var(--dim);margin:18px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:4px}
.crumb li+li::before{content:"›";margin-right:4px}
.crumb a{color:var(--dim)}
article h1{font-size:clamp(25px,5.4vw,34px);line-height:1.45;font-weight:900;margin:14px 0 10px;letter-spacing:.03em;word-break:auto-phrase}
.meta{font-size:13px;color:var(--dim)}
.hero{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;margin:18px 0 6px}
.lead{font-size:17px}
.toc{background:#10132b;border:1px solid var(--rim);border-radius:12px;padding:16px 20px;margin:24px 0}
.toc b{display:block;font-size:14px;color:var(--gold);letter-spacing:.1em}
.toc ol{margin:6px 0 0;padding-left:1.3em;font-size:15px}
.toc a{color:var(--spot)}
article h2{font-size:22px;line-height:1.5;font-weight:900;margin:44px 0 12px;padding-left:14px;border-left:5px solid var(--gold)}
article h3{font-size:18px;font-weight:900;margin:28px 0 8px;color:var(--gold)}
article p{margin:0 0 14px}
article ul,article ol{margin:0 0 14px;padding-left:1.4em}
article li{margin-bottom:4px}
.point{background:rgba(235,192,106,.08);border:1px solid rgba(235,192,106,.4);border-radius:12px;padding:14px 18px;margin:18px 0}
.point b{color:var(--gold)}
table{width:100%;border-collapse:collapse;margin:8px 0 18px;font-size:15px}
th,td{border:1px solid var(--rim);padding:9px 10px;text-align:left;vertical-align:top}
th{background:#10132b;white-space:nowrap}
.cta{margin:44px 0 10px;padding:24px 22px;border-radius:14px;border:1px solid rgba(235,192,106,.45);background:linear-gradient(135deg,rgba(235,192,106,.14),transparent 60%),var(--curtain)}
.cta h2{margin:0 0 8px;border:0;padding:0;font-size:20px}
.cta p{color:var(--dim);font-size:15.5px}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:900;text-decoration:none;border-radius:99px;padding:12px 22px;font-size:15px}
.btn.line{background:var(--green);color:#fff}
.btn.gold{background:var(--gold);color:#1c1405}
.btn.sub{border:1px solid var(--rim);color:var(--spot)}
.related{margin:40px 0 0}
.related h2{font-size:19px;border:0;padding:0;margin:0 0 12px}
.list{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.list a{display:grid;grid-template-columns:150px 1fr;gap:14px;align-items:center;background:var(--curtain);border:1px solid var(--rim);border-radius:12px;padding:10px;color:var(--spot);text-decoration:none}
.list a:hover{border-color:rgba(235,192,106,.55)}
.list img{width:150px;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:8px}
.list b{display:block;font-size:16px;line-height:1.55}
.list small{display:block;color:var(--dim);font-size:13.5px;line-height:1.6;margin-top:2px}
@media (max-width:520px){.list a{grid-template-columns:110px 1fr}.list img{width:110px}}
footer{border-top:1px solid var(--rim);margin-top:56px;padding:24px 0 40px;color:var(--dim);font-size:13.5px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px}
footer a{color:var(--dim)}