*{box-sizing:border-box}html{color-scheme:dark;scroll-behavior:smooth}body{margin:0;background:#101727;color:#f6f1e7;font:16px/1.8 system-ui,-apple-system,"Noto Sans JP",sans-serif}a{color:#b6dcff}button,a{touch-action:manipulation}a:focus-visible,button:focus-visible{outline:3px solid #f6ca77;outline-offset:4px}header,main,footer{max-width:1100px;margin:auto;padding:24px}header{display:flex;align-items:center;gap:15px;flex-wrap:wrap}header img{width:52px;height:52px;border-radius:14px}header>a{font-weight:800;text-decoration:none;color:#fff}nav{display:flex;gap:16px;margin-left:auto;flex-wrap:wrap}.lang{border:1px solid #7da2cb;border-radius:22px;color:white;background:#1d2a42;padding:8px 16px;cursor:pointer}.lang[aria-pressed=true]{background:#f2d59c;color:#17243a;border-color:#f2d59c}.hero{display:grid;grid-template-columns:1fr .65fr;align-items:center;gap:40px;margin:28px 0 52px}.hero h1{font-size:clamp(42px,8vw,82px);line-height:1.12;margin:12px 0}.eyebrow{letter-spacing:.23em;color:#e8ca8d;font-size:12px}.hero .art{width:100%;max-height:380px;object-fit:contain;filter:drop-shadow(0 14px 30px #080c18)}.lead{color:#c4d4e5;font-size:19px;max-width:620px}.card{border:1px solid #3b4c65;border-radius:24px;background:linear-gradient(145deg,#1c2940,#151e30);padding:clamp(22px,4vw,38px);margin:22px 0;box-shadow:0 15px 35px #0002}.card h2{font-size:25px;margin:0 0 14px;color:#ffe1a0}.card p{margin:10px 0}.links{display:flex;flex-wrap:wrap;gap:14px;margin:24px 0}.pill{display:inline-flex;align-items:center;min-height:48px;padding:10px 22px;border-radius:25px;background:#ead1a0;color:#142238;font-weight:800;text-decoration:none}.pill.secondary{color:#eaf5ff;background:#273c58;border:1px solid #6c96bc}.note{color:#afc2d5;font-size:14px}.section-title{font-size:clamp(34px,6vw,48px);line-height:1.3}.frog{width:72px;height:72px;object-fit:contain;float:right;margin:0 0 10px 20px}footer{color:#a8b9cc;font-size:12px;border-top:1px solid #34445a;margin-top:50px}footer a{margin-right:20px}@media(max-width:650px){header,main,footer{padding:19px}nav{margin-left:0;width:100%;gap:13px;font-size:14px}.hero{grid-template-columns:1fr;gap:12px;margin:20px 0}.hero .art{height:180px;order:-1}.lead{font-size:16px}.card{border-radius:18px}.links{gap:10px}.pill{font-size:14px}}
