@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap";
:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#183e36;--green:#244e42;--mint:#c4ecd0;--paper:#f5f7f3;--line:#dce5dd;--muted:#64796e}*{box-sizing:border-box}body{background:var(--paper);color:var(--ink);margin:0;font:15px/1.65 Noto Sans KR,system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);color:var(--ink);background:#fff;border-radius:7px;padding:10px 14px;transition:background .15s}button:hover{background:#eff5ef}button:disabled,fieldset:disabled button{opacity:.5;cursor:wait}button:focus-visible,a:focus-visible,textarea:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #6b9d78}code,pre,textarea,time{font-family:IBM Plex Mono,ui-monospace,monospace}.site-header,main,.site-footer{max-width:1120px;margin:auto}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:25px 0;display:flex}.brand{letter-spacing:-1px;align-items:baseline;gap:7px;font-size:25px;font-weight:900;display:flex}.brand span{font-weight:500}.brand i{letter-spacing:0;background:#e2eae2;border-radius:4px;align-self:center;padding:3px 5px;font:10px IBM Plex Mono,monospace}.site-header nav{gap:24px;font-size:13px;display:flex}.intro{padding:64px 0 40px}.eyebrow{letter-spacing:1.5px;font:500 10px/1.5 IBM Plex Mono,monospace}.live-dot{background:#55845f;border-radius:50%;width:6px;height:6px;margin:0 6px 1px 0;display:inline-block}h1{letter-spacing:-2px;margin:17px 0 22px;font-size:clamp(32px,4vw,50px);font-weight:900;line-height:1.3}h1 span{color:#5a7967}.intro-copy{color:var(--muted);margin:0;font-size:16px;line-height:1.85}.install{flex-wrap:wrap;align-items:center;gap:14px;margin-top:28px;font-size:11px;display:flex}.install code{overflow-wrap:anywhere;background:#e9efe7;border-radius:5px;padding:9px 12px}.install>span{color:#8c9d90}.playground{border:1px solid var(--line);background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 8px 25px #173c3604}.playground-heading{justify-content:space-between;align-items:center;gap:15px;padding:28px 30px 23px;display:flex}.playground h2{letter-spacing:-.8px;margin:5px 0 0;font-size:22px}.status-pill{white-space:nowrap;border:1px solid var(--line);color:var(--muted);border-radius:20px;padding:5px 10px;font-size:11px}.status-pill.active{color:#285c3b;background:#e6f6e9;border-color:#b7d5be}.mode-nav{border-top:1px solid var(--line);border-bottom:1px solid var(--line);grid-template-columns:repeat(4,1fr);display:grid}.mode-nav a{border-right:1px solid var(--line);justify-content:center;align-items:center;gap:10px;padding:16px;font:600 15px IBM Plex Mono,monospace;display:flex}.mode-nav a:last-child{border:0}.mode-nav span{color:var(--muted);font:11px Noto Sans KR,sans-serif}.mode-nav a[aria-current]{background:var(--green);color:#fff}.mode-nav a[aria-current] span{color:var(--mint)}.mode-description{padding:21px 30px}.mode-description strong{font-size:14px}.mode-description p{color:var(--muted);margin:3px 0 0;font-size:12px}.console-strip{color:var(--mint);background:#193e34;border-radius:8px;justify-content:space-between;align-items:center;gap:15px;margin:0 30px 26px;padding:18px 20px;display:flex}.console-strip>div{min-width:0}.console-strip span{letter-spacing:1.2px;color:#9bbdaa;margin-bottom:9px;font:9px IBM Plex Mono,monospace;display:block}.console-strip code{overflow-wrap:anywhere;font-size:13px}.console-strip button{color:#dbefdc;background:#325347;border-color:#4b6d58;flex-shrink:0;padding:8px 12px;font-size:11px}.workspace{border-top:1px solid var(--line);grid-template-columns:1fr 1fr;display:grid}.workspace>section{min-width:0;padding:25px 30px}.editor-pane{border-right:1px solid var(--line)}.result-pane{background:#fafcf9}.pane-heading{align-items:center;gap:9px;margin-bottom:22px;display:flex}.step{color:var(--muted);border:1px solid var(--line);border-radius:3px;padding:2px 5px;font:10px IBM Plex Mono,monospace}h3{margin:0;font-size:14px;font-weight:700}.segmented{border:1px solid var(--line);background:#f3f6f0;border-radius:8px;gap:3px;padding:3px;display:flex}.segmented button{background:0 0;border-color:#0000;flex:1;padding:9px 8px;font-size:12px}.segmented button[aria-pressed=true]{border-color:var(--line);background:#fff;box-shadow:0 1px 3px #173c3610}.segmented small{color:var(--muted);margin-left:5px;font-size:10px}.editor-label{color:var(--muted);justify-content:space-between;margin-top:20px;font:10px IBM Plex Mono,monospace;display:flex}fieldset{border:0;min-width:0;margin:0;padding:0}textarea{resize:vertical;color:#264739;background:#fcfefb;border:1px solid #c9d8ca;border-radius:7px;width:100%;min-height:192px;margin:9px 0 14px;padding:17px;font-size:13px;line-height:1.7;display:block}textarea:disabled{opacity:.65}.http-input{align-items:center;gap:10px;margin:10px 0;font-size:12px;display:flex}.http-input input{border:1px solid var(--line);border-radius:5px;width:90px;padding:5px 8px}.editor-actions{gap:8px;display:flex}.editor-actions button{font-size:12px}.editor-actions .primary{background:var(--green);color:#fff;border-color:var(--green);flex:1;justify-content:space-between;display:flex}.pane-note{color:var(--muted);margin:16px 0 0;font-size:11px;line-height:1.8}.error{color:#963b33;overflow-wrap:anywhere;background:#fff1ed;border-radius:5px;padding:9px;font-size:12px}.result-meta{color:var(--muted);justify-content:space-between;align-items:center;font:9px IBM Plex Mono,monospace;display:flex}.http-badge{color:#416f46;background:#e7f0e7;border-radius:4px;padding:5px 8px}.total-block{margin:24px 0 18px}.total-block>span{color:var(--muted);font-size:10px;display:block}.total-block strong{letter-spacing:-3px;overflow-wrap:anywhere;font:500 53px/1.2 IBM Plex Mono,monospace;display:block}.result-json{white-space:pre-wrap;overflow-wrap:anywhere;background:#eff4eb;border-radius:7px;max-height:260px;margin:0;padding:17px;font-size:11px;line-height:1.7;overflow:auto}.render-stamp{color:#7e8f82;flex-wrap:wrap;gap:9px;margin-top:14px;font-size:9px;display:flex}.render-stamp time{font-size:9px}.session-note{color:var(--muted);border-top:1px solid var(--line);margin:0;padding:16px 30px;font-size:11px}.session-note strong{color:var(--ink)}.benefits{grid-template-columns:repeat(3,1fr);gap:35px;padding:43px 0 33px;display:grid}.benefits span{color:var(--muted);letter-spacing:1px;font:9px IBM Plex Mono,monospace}.benefits h3{margin:9px 0;font-size:15px}.benefits p{color:var(--muted);margin:0;font-size:12px}.limits{border-top:1px solid var(--line);color:var(--muted);padding:20px 0;font-size:11px}.limits summary{cursor:pointer;color:var(--ink);font-size:12px}.site-footer{border-top:1px solid var(--line);color:var(--muted);padding:23px 0 35px;font-size:10px}.site-footer p{margin:5px 0}.site-footer a{margin-top:5px;text-decoration:underline;display:inline-block}@media (max-width:1180px){.site-header,main,.site-footer{margin-left:24px;margin-right:24px}}@media (max-width:700px){.site-header,main,.site-footer{margin-left:16px;margin-right:16px}.site-header{padding:18px 0}.brand{font-size:21px}.site-header nav{gap:16px;font-size:11px}.intro{padding:38px 0 30px}h1{letter-spacing:-1.5px}.intro-copy{font-size:13px}.install{gap:7px;font-size:10px}.install>span{display:none}.playground-heading{padding:22px 18px}.playground h2{font-size:19px}.mode-nav a{flex-direction:column;gap:4px;padding:13px 7px;font-size:13px}.mode-nav span{font-size:9px}.mode-description{padding:18px}.console-strip{flex-direction:column;align-items:flex-start;gap:12px;margin:0 18px 20px;padding:16px}.console-strip code{font-size:12px}.console-strip button{align-self:flex-end}.workspace{grid-template-columns:1fr}.workspace>section{padding:23px 18px}.editor-pane{border-right:0;border-bottom:1px solid var(--line)}.session-note{padding:15px 18px;line-height:1.9}.benefits{grid-template-columns:1fr;gap:23px;padding:30px 0}.benefits p{font-size:12px}.status-pill{padding:4px 7px;font-size:9px}.eyebrow{letter-spacing:1px;font-size:8px}}.cache-tools{border-top:1px solid var(--line,#dce6e0);background:#f2f6f0;justify-content:space-between;align-items:center;gap:20px;padding:22px 30px;display:flex}.cache-tools strong{font-size:14px}.cache-tools p{color:#587168;margin:7px 0;font-size:12px}.cache-tools code{overflow-wrap:anywhere;font-size:11px}.cache-actions{flex-shrink:0;gap:8px;display:flex}.cache-actions button{color:#244e40;cursor:pointer;background:#fff;border:1px solid #d4dfd7;border-radius:7px;padding:10px;font-size:12px}.cache-actions button:disabled{opacity:.45;cursor:wait}@media (max-width:700px){.cache-tools{flex-direction:column;align-items:stretch;padding:18px}.cache-actions button{flex:1}}