.real-sample{padding-top:40px;padding-bottom:56px}
.rs-head{display:flex;align-items:center;gap:20px;border-bottom:1px solid var(--line);padding-bottom:12px}
.rs-head h2{margin:0;font:400 24px/1.3 var(--serif)}
.rs-tabs{display:flex;gap:4px;margin-left:auto}
.rs-tabs button,.rs-copy{border:1px solid transparent;background:none;border-radius:999px;padding:4px 12px;font-size:13px;color:var(--muted);cursor:pointer;transition:color .15s,border-color .15s}
.rs-tabs button[aria-selected=true]{color:var(--ink);border-color:var(--line)}
.rs-tabs:has(button:hover) button:not(:hover){opacity:.55}
.rs-copy{border-color:var(--line);color:var(--ink)}
.rs-copy.is-done{color:var(--accent);border-color:var(--accent)}
.rs-body{margin-top:16px}
.rs-label{margin:16px 0 8px;font-size:12px;color:var(--muted)}
.real-sample.is-tabbed .rs-label{display:none}
.rs-code{margin:0;padding:16px 18px;border-radius:12px;background:#1d1d1b;color:#e8e6dc;font:12.5px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-word;max-height:460px;overflow:auto}
.rs-code .j-k{color:#c9c5b5}.rs-code .j-s{color:#b9d1c2}.rs-code .j-n{color:#e7c08f}
.rs-plain[data-lang]::before{content:attr(data-lang);display:block;margin-bottom:8px;font-size:11px;color:#9c998d}
.rs-table{overflow:auto;max-height:460px;border:1px solid var(--line);border-radius:12px;background:#fff}
.rs-table table{width:100%;font-size:13px}
.rs-table th,.rs-table td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top;white-space:nowrap}
.rs-table td{white-space:normal;min-width:7em}
.rs-table th{position:sticky;top:0;background:#f6f5f0;font-weight:600}
.rs-table tbody tr{transition:background .15s}.rs-table tbody tr:hover{background:#f4f3ee}
.rs-text{white-space:pre-wrap;font-size:15px;line-height:1.85;padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:#fff}
.rs-source{margin:12px 0 0;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--muted)}
@media (max-width:767px){.rs-head{flex-wrap:wrap}.rs-tabs{margin-left:0;order:3;width:100%;overflow-x:auto}}
@media (prefers-reduced-motion:reduce){.real-sample *{transition:none!important}}
