.portal-field { min-width:0; }
.portal-field-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.portal-field-heading label { margin:0; }
.portal .portal-api-guide { display:inline-flex; align-items:center; gap:5px; padding:3px 0; min-height:26px; flex:none; border:0; background:transparent; color:#1763ca; font-size:12px; font-weight:500; }
.portal-api-guide::before { content:'?'; display:inline-grid; place-items:center; width:15px; height:15px; border:1px solid #9cb9df; border-radius:50%; font-size:10px; }
.portal .portal-api-guide:hover { color:#084da8; text-decoration:underline; }
.portal-field > input { display:block; width:100%; }
.portal-field > .portal-field-hint { display:block; margin-top:5px; }
body.api-guide-open { overflow:hidden; }
.api-guide-dialog { width:min(1000px,calc(100vw - 40px)); max-width:none; max-height:calc(100dvh - 48px); margin:auto; padding:0; border:1px solid #dde5ef; border-radius:16px; background:#fff; color:#263248; box-shadow:0 20px 80px #182d4c38; font:14px/1.55 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
.api-guide-dialog::backdrop { background:#1d2c4359; backdrop-filter:blur(4px); }
.api-guide-shell { display:flex; flex-direction:column; max-height:calc(100dvh - 50px); }
#eburo-api-guide.api-guide-dialog .api-guide-header { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:20px 26px; border-bottom:1px solid #e6ebf2; }
.api-guide-header p { margin:0 0 4px; font-size:10px; letter-spacing:.08em; color:#65778e; }
.api-guide-dialog h2 { margin:0; font-size:19px; font-weight:650; line-height:1.4; letter-spacing:-.02em; }
.api-guide-dialog button { cursor:pointer; font:inherit; }
.api-guide-dialog .api-guide-close { display:grid; place-items:center; width:36px; height:36px; padding:0; border:0; border-radius:8px; background:#f4f6fa; color:#617087; font-size:25px; }
.api-guide-layout { display:grid; grid-template-columns:1fr 1fr; min-height:360px; overflow:auto; overscroll-behavior:contain; }
.api-guide-visual { display:flex; align-items:center; padding:24px; background:#f4f7fc; border-right:1px solid #e6ebf2; }
.api-guide-copy { min-width:0; padding:28px; }
.api-guide-count { margin:0 0 10px; font-size:12px; font-weight:600; color:#5a6d88; }
.api-guide-progress { display:flex; gap:5px; margin-bottom:24px; }
.api-guide-progress span { flex:1; height:3px; border-radius:2px; background:#e6ecf5; }
.api-guide-progress .done { background:#2466db; }
.api-guide-dialog .api-guide-instruction h3 { margin:0 0 12px; font-size:20px; font-weight:650; line-height:1.3; letter-spacing:-.02em; }
.api-guide-instruction > p { margin:0 0 14px; }
.api-guide-instruction .api-guide-hint { margin:20px 0 0; padding:12px 14px; background:#f5f7fa; border-left:2px solid #b4c7e2; border-radius:0 6px 6px 0; color:#5b6b80; font-size:12px; line-height:1.55; }
.api-guide-link { display:inline-flex; align-items:center; min-height:36px; color:#145fc9; font-weight:600; text-decoration:none; }
.api-guide-link:hover { text-decoration:underline; }
.api-guide-rights { padding:0; margin:0; list-style:none; }
.api-guide-rights li { margin:5px 0; font-size:13px; font-weight:600; }
.api-guide-rights li::before { content:'✓'; margin-right:10px; color:#247359; }
#eburo-api-guide.api-guide-dialog .api-guide-footer { display:flex; justify-content:space-between; gap:12px; padding:16px 26px; margin:0; border-top:1px solid #e6ebf2; }
.api-guide-footer button { min-height:40px; padding:8px 18px; border:1px solid #d6dfea; border-radius:7px; font-size:13px; font-weight:600; background:#fff; color:#435a76; }
.api-guide-footer [data-next] { background:#2466db; color:#fff; border-color:#2466db; }
.api-guide-footer [data-next]:hover { background:#1855c0; }
.api-guide-footer button:disabled { visibility:hidden; }
.api-guide-dialog :focus-visible,.portal-api-guide:focus-visible { outline:3px solid #8cafe9; outline-offset:3px; }
.api-demo { width:100%; border:1px solid #dae3ef; border-radius:10px; background:#fff; box-shadow:0 6px 18px #233e5e0a; overflow:hidden; }
.api-demo-top { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid #e7edf5; }
.api-demo-top b { color:#0865e4; font-size:13px; }
.api-demo-top span { font-size:9px; color:#7b8ba0; }
.api-demo-body { display:grid; grid-template-columns:103px minmax(0,1fr); min-height:235px; }
.api-demo-nav { display:flex; flex-direction:column; gap:9px; padding:20px 9px; background:#fbfcfe; font-size:9px; color:#8794a6; border-right:1px solid #edf1f6; }
.api-demo-nav strong { font-size:9px; color:#67788f; }
.api-demo-nav span { padding:4px 3px; }
.api-demo-nav .selected { color:#1662d2; background:#edf4ff; border-left:2px solid #2466db; }
.api-demo-main { padding:20px 15px; min-width:0; }
.api-guide-dialog .api-demo-main h3 { font-size:15px; line-height:1.3; margin:0 0 16px; }
.api-demo-main h4 { font-size:11px; margin:14px 0 7px; }
.api-demo-field { padding:9px 10px; border:1px solid #e0e6ef; border-radius:6px; margin:9px 0; background:#fff; }
.api-demo-field small { display:block; color:#6f8199; font-size:9px; }
.api-demo-field strong { display:block; font-size:11px; line-height:1.5; font-weight:500; overflow-wrap:anywhere; }
.api-demo-field.highlighted { background:#f3f7ff; border-color:#3e7ce8; box-shadow:0 0 0 3px #2466db12; }
.api-demo-button { display:inline-block; padding:7px 10px; margin-top:3px; background:#2466db; color:white; border-radius:5px; font-size:10px; }
.api-demo-button.muted { background:#e9eef6; color:#8998ac; }
.api-demo-callout { margin:13px 0 0; color:#3166ab; font-size:10px; line-height:1.5; }
.api-demo-right { border:1px solid #d0dff4; background:#f3f7ff; border-radius:5px; padding:7px 9px; font-size:10px; color:#275d9e; margin:7px 0; }
.api-demo-success { color:#277354; font-size:12px; margin:12px 0 18px; }
@media (max-width:700px) {
 .api-guide-dialog { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); border-radius:12px; }
 .api-guide-shell { max-height:calc(100dvh - 26px); }
 #eburo-api-guide.api-guide-dialog .api-guide-header { padding:14px 16px; }
 .api-guide-dialog h2 { font-size:16px; }
 .api-guide-layout { display:flex; flex-direction:column; min-height:0; }
 .api-guide-visual { border-right:0; border-bottom:1px solid #e6ebf2; padding:14px 18px; }
 .api-demo { max-width:400px; margin:auto; }
 .api-demo-body { min-height:0; grid-template-columns:82px minmax(0,1fr); }
 .api-demo-main { padding:12px; }
 .api-demo-main h3 { margin-bottom:10px; }
 .api-demo-nav { padding:14px 5px; gap:6px; }
 .api-demo-top { padding:9px 12px; }
 .api-demo-field { padding:6px 8px; margin:7px 0; }
 .api-guide-copy { padding:18px; }
 .api-guide-progress { margin-bottom:16px; }
 .api-guide-dialog .api-guide-instruction h3 { font-size:18px; }
 #eburo-api-guide.api-guide-dialog .api-guide-footer { padding:12px 16px; }
 .api-guide-footer button { min-height:44px; }
 .portal .portal-api-guide { min-height:32px; }
}
