@font-face{font-family:'Inter';src:local('Inter')}
:root{--mint:#34D399;--ink:#1F2A37}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Inter',system-ui,-apple-system,sans-serif;color:#E6EBE8;background:#0A0E0D;line-height:1.65;-webkit-font-smoothing:antialiased}
.hero{position:relative;overflow:hidden;padding:calc(env(safe-area-inset-top,0px) + 20px) 20px 64px;background:linear-gradient(180deg,#1E8FFF 0%,#4FB4FF 55%,#8EE0A2 100%)}
.hero.t{background:linear-gradient(180deg,#8B5CF6 0%,#C084FC 55%,#FFC2E2 100%)}
.hero::after{content:'';position:absolute;left:-10%;right:-10%;bottom:-1px;height:48px;background:#0A0E0D;border-radius:50% 50% 0 0/100% 100% 0 0}
.bar{max-width:760px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}
.brand{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font-weight:900;font-size:18px;letter-spacing:-.02em}
.brand img{border-radius:9px}
.back{color:#fff;font-weight:800;font-size:14px;text-decoration:none;padding:8px 14px;border-radius:99px;background:rgba(255,255,255,.22);border:1.5px solid rgba(255,255,255,.5)}
.title{max-width:760px;margin:38px auto 0;position:relative}
.title h1{font-size:clamp(38px,9vw,64px);line-height:1;font-weight:900;letter-spacing:-.035em;color:#fff;text-shadow:0 .07em 0 rgba(14,60,140,.55)}
.title p{margin-top:12px;font-weight:700;color:#fff;opacity:.95}
.pig{position:absolute;right:-4px;top:-18px;width:clamp(86px,22vw,150px);height:auto;filter:drop-shadow(0 14px 12px rgba(0,0,0,.25))}
main{max-width:760px;margin:0 auto;padding:8px 20px 72px}
.note{margin:0 0 28px;padding:14px 16px;border-radius:16px;background:rgba(255,200,0,.1);border:1px solid rgba(255,200,0,.35);color:#FFE9A6;font-size:14px}
.toc{margin:0 0 30px;padding:16px 18px;border-radius:18px;background:#141A18;border:1px solid rgba(52,211,153,.2)}
.toc b{display:block;margin-bottom:6px;color:#fff}
.toc a{display:block;padding:3px 0;color:#9FE8CB;text-decoration:none;font-weight:600;font-size:15px}
section{margin-bottom:34px;scroll-margin-top:16px}
h2{font-size:clamp(22px,5.5vw,28px);line-height:1.2;font-weight:900;color:#fff;margin-bottom:10px;letter-spacing:-.02em}
h2 span{display:inline-grid;place-items:center;width:34px;height:34px;margin-right:10px;border-radius:50%;background:var(--mint);color:#06281D;font-size:16px;vertical-align:middle}
p,li{color:#C8D0CB;font-size:16px}
p+p,ul+p,p+ul{margin-top:10px}
ul{padding-left:22px}li{margin:5px 0}
strong{color:#fff}
a{color:#7CE8C0}
table{width:100%;border-collapse:collapse;margin-top:10px;font-size:15px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.1);vertical-align:top;color:#C8D0CB}
th{color:#fff}
.tw{overflow-x:auto;border-radius:12px;border:1px solid rgba(255,255,255,.1)}
.card{margin-top:12px;padding:16px 18px;border-radius:18px;background:#141A18;border:1px solid rgba(52,211,153,.2)}
footer{border-top:1px solid rgba(255,255,255,.08);padding:30px 20px calc(30px + env(safe-area-inset-bottom,0px));text-align:center;color:#8e9793;font-size:14px}
footer a{color:#B6BDB9;margin:0 10px;text-decoration:none;font-weight:600}