:root { --bg:#0b0f1a; --card:#161d31; --line:rgba(255,255,255,.08); --text:#eef1f8; --muted:#9aa3b8; --accent:#ff9f1c; --accent-2:#ffb84d; }
@media (prefers-color-scheme: light) { :root { --bg:#f6f7fb; --card:#fff; --line:rgba(10,15,30,.09); --text:#111522; --muted:#5b6377; } }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font:17px/1.65 -apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,sans-serif; -webkit-font-smoothing:antialiased; }
a { color: var(--accent); }
nav { border-bottom:1px solid var(--line); }
nav .in { max-width:760px; margin:0 auto; padding:0 24px; height:60px; display:flex; align-items:center; gap:10px; }
nav a.brand { color:var(--text); text-decoration:none; font-weight:700; display:flex; align-items:center; gap:10px; }
nav img { width:28px; height:28px; }
nav .sp { flex:1; }
nav a.cta { text-decoration:none; font-weight:650; font-size:15px; padding:8px 14px; border-radius:10px; color:#1a1205; background:linear-gradient(180deg,var(--accent-2),var(--accent)); }
main { max-width:760px; margin:0 auto; padding:48px 24px 72px; }
.crumbs { font-size:14px; color:var(--muted); margin-bottom:12px; }
.crumbs a { color:var(--muted); }
h1 { font-size:clamp(30px,5vw,44px); line-height:1.1; letter-spacing:-.03em; margin:0 0 16px; }
h2 { font-size:26px; letter-spacing:-.02em; margin:44px 0 10px; }
h3 { font-size:19px; margin:28px 0 6px; }
p, li { color: color-mix(in srgb, var(--text) 86%, var(--muted)); }
.lead { font-size:19px; color:var(--muted); }
code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em; background:var(--line); padding:2px 6px; border-radius:6px; }
img { max-width:100%; height:auto; border-radius:12px; border:1px solid var(--line); }
.note { background:var(--card); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:10px; padding:14px 18px; margin:24px 0; }
.note p { margin:0; }
table { width:100%; border-collapse:collapse; font-size:15px; margin:16px 0; }
th, td { text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--muted); font-weight:600; }
.box { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; margin:48px 0 0; text-align:center; }
.box a.btn { display:inline-block; margin-top:8px; text-decoration:none; font-weight:650; padding:12px 20px; border-radius:12px; color:#1a1205; background:linear-gradient(180deg,var(--accent-2),var(--accent)); }
.more { margin-top:40px; }
.more a { display:block; margin:6px 0; }
footer { border-top:1px solid var(--line); color:var(--muted); font-size:13px; }
footer .in { max-width:760px; margin:0 auto; padding:28px 24px 40px; }
footer a { color:var(--muted); }