:root { --bg:#061018; --panel:#0d1d2a; --panel2:#102737; --line:#294e60; --text:#eaf7ff; --muted:#9bb4c1; --cyan:#61efd0; --amber:#ffc86b; }
* { box-sizing:border-box; }
html { background:var(--bg); }
body { max-width:100%; margin:0; color:var(--text); background:radial-gradient(circle at 88% 0,#184859 0,transparent 28rem),radial-gradient(circle at 0 100%,#202352 0,transparent 34rem),var(--bg); font-family:Inter,"Hiragino Sans","Yu Gothic UI",Meiryo,sans-serif; line-height:1.8; }
a { color:var(--cyan); } a:hover { color:#b4fff1; }
.shell { width:min(920px,calc(100% - 34px)); margin:auto; padding:30px 0 58px; }
.site-head { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:5px 0 30px; }
.brand { color:var(--text); text-decoration:none; font-size:1.02rem; font-weight:900; letter-spacing:.04em; }.brand small { display:block; color:var(--cyan); font-size:.61rem; letter-spacing:.16em; }
.back { padding:7px 11px; border:1px solid var(--line); border-radius:8px; color:#c8dce3; text-decoration:none; font-size:.78rem; }.back:hover { border-color:var(--cyan); }
.hero { padding:clamp(25px,6vw,52px); border:1px solid #3b6476; border-radius:20px; background:linear-gradient(145deg,#102b37e8,#101a35e8); box-shadow:0 24px 80px #0007; }
.eyebrow { margin:0; color:var(--cyan); font-size:.7rem; font-weight:900; letter-spacing:.17em; }
h1 { margin:10px 0 5px; font-size:clamp(2rem,6vw,3.7rem); line-height:1.15; letter-spacing:-.045em; }
.updated { margin:0; color:var(--muted); font-size:.8rem; }
.intro { margin:24px 0 0; color:#c6d8df; }
.content { margin-top:22px; padding:clamp(22px,5vw,44px); border:1px solid #2f5567; border-radius:16px; background:#081722e8; }
section + section { margin-top:34px; padding-top:30px; border-top:1px solid #274959; }
h2 { margin:0 0 12px; color:var(--cyan); font-size:clamp(1.15rem,3vw,1.55rem); line-height:1.35; } h3 { margin:20px 0 6px; font-size:1rem; }
p,li { color:#c7d7de; } p { margin:9px 0; } ul,ol { padding-left:1.35em; } li + li { margin-top:5px; }
.note { margin:18px 0; padding:14px 16px; border:1px solid #705d31; border-radius:10px; color:#e7d6a7; background:#211c0e; font-size:.86rem; }
.contact-card { padding:20px; border:1px solid #3c697b; border-radius:13px; background:#0d2330; }.contact-address { display:inline-block; margin-top:5px; color:var(--cyan); font-size:clamp(1rem,3vw,1.3rem); font-weight:900; overflow-wrap:anywhere; }
.form-grid { display:grid; gap:14px; margin-top:20px; }.form-grid label { display:grid; gap:5px; color:#c8dce3; font-size:.84rem; font-weight:700; }.form-grid input,.form-grid select,.form-grid textarea { width:100%; padding:10px 12px; border:1px solid #426b7d; border-radius:8px; color:var(--text); background:#07151e; font:inherit; }.form-grid textarea { min-height:140px; resize:vertical; }.submit { min-height:49px; padding:10px 16px; border:0; border-radius:9px; color:#061411; background:var(--cyan); font:inherit; font-weight:900; cursor:pointer; }.submit:hover { background:#a5ffed; }
.site-foot { display:flex; flex-wrap:wrap; gap:9px 18px; padding:28px 4px 0; color:var(--muted); font-size:.76rem; }.site-foot a { color:#b3cbd5; text-decoration:none; }.site-foot a:hover { color:var(--cyan); }
.article-nav { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }.article-nav a { padding:7px 11px; border:1px solid var(--line); border-radius:8px; color:#c8dce3; font-size:.78rem; font-weight:700; text-decoration:none; }.article-nav a:hover { border-color:var(--cyan); color:var(--cyan); }.article-nav a[aria-current="page"] { border-color:var(--cyan); color:#061411; background:var(--cyan); }
.guide-callout { margin:18px 0; padding:16px; border:1px solid #3c697b; border-radius:12px; background:#0d2330; }.guide-callout strong { color:var(--cyan); }.step-list { counter-reset:steps; list-style:none; padding-left:0; }.step-list li { position:relative; min-height:42px; padding:7px 0 7px 48px; }.step-list li::before { position:absolute; top:7px; left:0; display:grid; width:31px; aspect-ratio:1; place-items:center; border:1px solid #4f8995; border-radius:50%; color:var(--cyan); content:counter(steps); counter-increment:steps; font-size:.8rem; font-weight:900; }.article-table { width:100%; margin:16px 0; border-collapse:collapse; font-size:.9rem; }.article-table th,.article-table td { padding:10px 12px; border:1px solid #315668; text-align:left; vertical-align:top; }.article-table th { color:#baf7ea; background:#0c2632; }.article-table td { color:#c7d7de; } details { padding:14px 0; border-top:1px solid #274959; } details:last-child { border-bottom:1px solid #274959; } summary { cursor:pointer; color:#d9edf2; font-weight:800; } details p { margin:10px 0 0; }
@media (max-width:540px) { .shell { width:min(100% - 24px,920px); padding-top:17px; }.site-head { padding-bottom:20px; }.hero,.content { border-radius:13px; }.hero { padding:26px 21px; }.content { padding:25px 20px; } }