:root{color-scheme:light;--ink:#172124;--muted:#526166;--paper:#f4f7f5;--card:#fff;--line:#d9e2df;--accent:#08717a;--deep:#0d3d42;--soft:#e9f4f2;--warn:#fff7df;--radius:20px;--shadow:0 18px 50px rgba(13,61,66,.1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font:16px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-wrap:anywhere}img{display:block;max-width:100%;height:auto}a{color:var(--accent);font-weight:700;text-underline-offset:3px}.wrap{width:min(1120px,calc(100% - 32px));margin-inline:auto}.reading{width:min(760px,calc(100% - 32px));margin-inline:auto}.site-header{padding:20px 0}.site-header nav,.site-footer nav{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px}.brand{margin-right:auto;color:var(--deep);font-size:1.1rem;text-decoration:none}.hero{padding:56px 0 44px}.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;align-items:center;gap:44px}.eyebrow{color:var(--accent);font-size:.82rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}h1,h2,h3{color:var(--deep);line-height:1.15}h1{margin:.15em 0;font-size:clamp(2.45rem,7vw,5.15rem);letter-spacing:-.05em}h2{margin-top:0;font-size:clamp(1.8rem,4vw,2.8rem);letter-spacing:-.025em}h3{font-size:1.2rem}.lead{max-width:690px;color:var(--muted);font-size:clamp(1.08rem,2vw,1.3rem)}.trust{color:var(--muted);font-size:.94rem}.app-icon{width:96px;border-radius:22px;box-shadow:var(--shadow)}.cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:26px 0}.cta{display:inline-block;padding:13px 20px;border-radius:999px;background:var(--deep);color:#fff;text-decoration:none;box-shadow:0 10px 24px rgba(13,61,66,.18)}.cta:hover{background:var(--accent)}section{padding:44px 0}.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.card{padding:25px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}.card h3{margin-top:0}.notice{padding:24px;border-left:5px solid var(--accent);border-radius:0 var(--radius) var(--radius) 0;background:var(--soft)}.warning{background:var(--warn)}.hero-shot,.app-screenshot{width:100%;height:auto;object-fit:contain;border-radius:24px;box-shadow:var(--shadow)}.hero-shot{max-height:620px}.screenshot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.article-hero{padding:46px 0 24px}.article-hero h1{font-size:clamp(2.35rem,6vw,4.35rem)}.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:44px;align-items:start}.article-body section{padding:24px 0}.toc{position:sticky;top:18px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--card)}.toc a{display:block;margin:7px 0}ul,ol{padding-left:1.35em}.example{padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}details{padding:16px 0;border-bottom:1px solid var(--line)}summary{color:var(--deep);font-weight:800;cursor:pointer}.site-footer{padding:40px 0 54px;color:var(--muted);font-size:.94rem}a:focus-visible,summary:focus-visible{outline:3px solid #f2b84b;outline-offset:4px;border-radius:5px}
@media(max-width:760px){.hero-grid,.article-layout{grid-template-columns:1fr}.card-grid,.screenshot-grid{grid-template-columns:1fr}.hero{padding-top:28px}.toc{position:static;order:-1}.hero-shot{max-height:560px}.cta{width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}