:root{color-scheme:light;--ink:#172d40;--muted:#53687a;--blue:#086baf;--line:#dce5ec;--page:#f4f7fa;--nav:#101c29}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--page);color:var(--ink);font:16px/1.8 "Malgun Gothic","Apple SD Gothic Neo",Arial,sans-serif}a{color:var(--blue);text-underline-offset:4px}a:hover{text-decoration-thickness:2px}a:focus-visible,summary:focus-visible{outline:3px solid #2a8ed1;outline-offset:5px}header{background:var(--nav);color:white;border-bottom:1px solid #304454}header .bar{max-width:1160px;margin:auto;min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:14px 28px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:white;font-size:23px;font-weight:800;white-space:nowrap}.brand img{width:34px;height:34px}.brand small{font-size:12px;font-weight:400;color:#c0cedb}header nav{display:flex;gap:8px;flex-wrap:wrap}header nav a{display:flex;align-items:center;min-height:44px;padding:5px 13px;color:#cddae5;text-decoration:none;border-radius:7px;font-size:14px}header nav a[aria-current=page],header nav a:hover{background:#254158;color:white}.skip{position:absolute;left:12px;top:-80px;background:white;padding:8px 16px;z-index:10}.skip:focus{top:8px}main{max-width:1160px;margin:0 auto;padding:0 28px 64px}.breadcrumbs{display:flex;gap:10px;font-size:13px;color:var(--muted);padding:22px 0 0}.breadcrumbs a{text-decoration:none}.hero{padding:50px 0 36px}.hero.compact{padding:40px 0 28px}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.13em;margin:0 0 10px}h1{font-size:clamp(30px,4.5vw,48px);line-height:1.3;letter-spacing:-.045em;margin:0 0 22px;overflow-wrap:anywhere}h2{font-size:25px;line-height:1.4;letter-spacing:-.03em;margin:0 0 18px}h3{font-size:18px;line-height:1.5;margin:24px 0 10px}p{margin:0 0 16px}.lead{font-size:18px;color:var(--muted);max-width:780px;word-break:keep-all}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 20px;border:1px solid var(--blue);border-radius:8px;background:var(--blue);color:white;text-decoration:none;font-size:14px;font-weight:700}.button.secondary{background:white;color:var(--blue);border-color:#bfd1df}.flow{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);margin:36px 0 0;padding:24px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:20px}.flow li{display:flex;align-items:flex-start;gap:14px}.flow b{font-size:26px;line-height:1.5;color:#8da9bf}.flow span{font-weight:700}.flow small{display:block;font-size:13px;font-weight:400;color:var(--muted)}section{margin-bottom:32px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.cards article,.surface{background:white;border:1px solid var(--line);border-radius:12px;padding:28px}.cards article{display:flex;flex-direction:column;align-items:flex-start}.cards article h3{margin-top:14px}.cards article p{font-size:15px;color:var(--muted)}.cards article a{margin-top:auto;font-size:14px;font-weight:700}.tag{font-size:10px;letter-spacing:.08em;background:#eaf3fa;color:#07649f;padding:3px 8px;border-radius:4px}.table-scroll{overflow-x:auto;margin:16px 0}table{border-collapse:collapse;width:100%;font-size:14px;text-align:left}th,td{padding:14px 16px;border-bottom:1px solid var(--line);vertical-align:top}thead th{background:#eef4f8;font-size:13px;color:#3b576c}tbody th{width:155px}tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}.split{display:grid;grid-template-columns:1fr 1fr;gap:36px}.note{background:#eaf2f8;border-left:3px solid #5992ba;padding:20px 24px;font-size:14px;color:#35556e;border-radius:0 8px 8px 0}.note h3{margin-top:0}ul,ol{padding-left:24px}li{padding-left:4px;margin-bottom:8px}li p{color:var(--muted);margin-top:4px}.section-nav{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.section-nav a{padding:7px 12px;background:white;border:1px solid var(--line);border-radius:6px;min-height:44px;font-size:13px;text-decoration:none}.steps{margin:18px 0;padding-left:24px}.steps li{padding-left:8px;margin-bottom:22px}.steps li::marker{font-weight:800;color:var(--blue)}pre{max-width:100%;overflow-x:auto;background:#142b3e;color:#deedfa;border-radius:8px;padding:20px;font-size:13px;line-height:1.8}code{font-family:Consolas,monospace;overflow-wrap:anywhere}.faq details{background:white;border:1px solid var(--line);border-radius:10px;margin-bottom:12px}.faq summary{cursor:pointer;padding:20px 24px;min-height:60px;font-weight:700;font-size:17px}.faq details>div{padding:0 24px 14px;color:var(--muted);font-size:15px}.faq details[open] summary{color:var(--blue)}footer{border-top:1px solid var(--line);padding:26px 28px;color:var(--muted);font-size:12px;text-align:center}footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;margin-bottom:12px}@media(max-width:760px){header .bar{align-items:flex-start;gap:12px;flex-direction:column;padding:16px 20px}header nav{gap:2px}header nav a{padding:5px 11px;font-size:13px}main{padding:0 20px 40px}.hero{padding-top:34px}.lead{font-size:16px}.cards,.split{grid-template-columns:1fr;gap:16px}.flow{grid-template-columns:1fr;gap:12px;margin-top:28px;padding:20px 0}.flow li{margin-bottom:0}.flow b{font-size:22px}.flow small{display:inline;margin-left:10px}.cards article,.surface{padding:22px 18px}.actions{gap:8px}.button{padding:10px 14px}.faq summary{padding:18px;font-size:16px}.faq details>div{padding:0 18px 12px}.table-scroll{margin:12px -4px}th,td{padding:12px 10px;font-size:13px}tbody th{min-width:98px;width:105px}h2{font-size:22px}.section-nav{gap:6px}.section-nav a{padding:7px 10px}pre{padding:16px;font-size:12px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.field-code-grid{min-width:1000px;table-layout:fixed;border-collapse:collapse}
.field-code-grid caption{text-align:left;padding:0 0 12px;color:var(--muted);font-size:13px}
.field-code-grid td{width:10%;padding:9px 5px;text-align:center;vertical-align:middle;border:1px solid var(--line)}
.field-code-grid td span{display:flex;align-items:center;justify-content:center;min-height:36px;font-size:12px;line-height:1.4;word-break:keep-all;overflow-wrap:anywhere}
.field-code-grid td code{display:block;margin-top:5px;color:var(--blue);font-size:15px;font-weight:700;line-height:1.5}
.field-code-grid td.empty{background:#f3f6f8}
.field-code-scroll:focus-visible{outline:3px solid #2a8ed1;outline-offset:4px}
.guide-block{margin-top:28px;padding-top:24px;border-top:1px solid var(--line);scroll-margin-top:24px}
.guide-block>h3{margin-top:0;font-size:20px;color:var(--blue)}
.guide-block h4{font-size:16px;margin:24px 0 12px}
.guide-extra{margin-top:28px;border:1px solid var(--line);border-radius:8px;background:#f6f9fb}
.guide-extra summary{cursor:pointer;min-height:48px;padding:14px 18px;font-size:14px;font-weight:700}
.guide-extra>div{padding:0 20px 8px}
.guide-extra[open] summary{color:var(--blue);border-bottom:1px solid var(--line)}
.field-code-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:20px 0 12px}
.field-code-toolbar p{margin:0;color:var(--muted);font-size:13px}
.code-image-download{padding:9px 15px;min-height:44px;background:#edf5fb;color:var(--blue);border:1px solid #bfd1df;border-radius:7px;font-size:13px;font-weight:600;cursor:pointer}
.code-image-download:disabled{opacity:.65;cursor:wait}
.code-image-download:focus-visible{outline:3px solid #2a8ed1;outline-offset:4px}
.code-image-status{font-size:13px;color:var(--muted);margin:0}
.code-image-status:empty{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.guide-screen{margin:24px 0 28px}
.guide-screen>a{display:block;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#edf2f6}
.guide-screen img{display:block;width:100%;height:auto}
.guide-screen figcaption{font-size:13px;color:var(--muted);line-height:1.7;margin-top:10px}
.guide-screen figcaption span{display:block;color:var(--blue);font-size:12px}