.bmc-developer{--surface:#ffffff;--surface-muted:#f8fafc;--border:#e2e8f0;--text-main:#0f172a;--text-muted:#64748b;--primary:#2563eb;--primary-dark:#1d4ed8;}
.rns-root{--rns-radius:12px;--rns-gap:1.25rem;--rns-track:var(--border);--rns-thumb:var(--primary);--rns-surface:var(--surface);--rns-muted:var(--text-muted);}
.rns-wrap{background:var(--rns-surface);border-radius:var(--rns-radius);border:1px solid var(--border);box-shadow:0 1px 3px rgba(0,0,0,0.06);overflow:hidden;}
.rns-platform{display:flex;padding:0.5rem;gap:0.5rem;background:var(--surface-muted);border-bottom:1px solid var(--border);flex-wrap:wrap;}
.rns-platform-btn{flex:1;min-width:120px;padding:0.75rem 1rem;border:none;border-radius:8px;font-weight:600;font-size:0.9375rem;cursor:pointer;background:transparent;color:var(--rns-muted);transition:color 0.2s, background 0.2s;}
.rns-platform-btn:hover{color:var(--text-main);background:rgba(0,0,0,0.04);}
.rns-platform-btn[aria-pressed="true"]{background:var(--rns-surface);color:var(--primary);box-shadow:0 1px 2px rgba(0,0,0,0.06);}
.rns-presets{display:flex;flex-wrap:wrap;gap:0.5rem;padding:var(--rns-gap);border-bottom:1px solid var(--border);}
.rns-preset{padding:0.5rem 0.875rem;border:1px solid var(--border);border-radius:999px;background:var(--rns-surface);font-size:0.8125rem;font-weight:500;cursor:pointer;color:var(--text-main);transition:border-color 0.2s, background 0.2s;}
.rns-preset:hover,.rns-preset:focus{border-color:var(--rns-thumb);background:rgba(37,99,235,0.06);}
.rns-main{display:grid;grid-template-columns:1fr;gap:var(--rns-gap);padding:var(--rns-gap);}
@media (min-width: 900px){.rns-main{grid-template-columns:minmax(280px, 1fr) minmax(260px, 1fr);}}
.rns-controls{display:flex;flex-direction:column;gap:1.25rem;}
.rns-slider{display:flex;flex-direction:column;gap:0.375rem;}
.rns-slider-top{display:flex;justify-content:space-between;align-items:center;}
.rns-slider-label{font-size:0.875rem;font-weight:500;color:var(--text-main);}
.rns-slider-value{font-size:0.8125rem;font-variant-numeric:tabular-nums;padding:0.25rem 0.5rem;border-radius:6px;background:var(--surface-muted);color:var(--rns-muted);min-width:2.5rem;text-align:center;}
.rns-range{width:100%;height:8px;border-radius:4px;background:var(--rns-track);-webkit-appearance:none;appearance:none;}
.rns-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--rns-thumb);cursor:pointer;border:3px solid var(--rns-surface);box-shadow:0 1px 3px rgba(0,0,0,0.2);}
.rns-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--rns-thumb);cursor:pointer;border:3px solid var(--rns-surface);box-shadow:0 1px 3px rgba(0,0,0,0.2);}
.rns-color-row{display:flex;align-items:center;gap:0.75rem;}
.rns-color-swatch{width:48px;height:40px;border:1px solid var(--border);border-radius:8px;cursor:pointer;padding:0;background:none;}
.rns-color-hex{flex:1;padding:0.5rem 0.75rem;border:1px solid var(--border);border-radius:8px;font-family:ui-monospace, monospace;font-size:0.875rem;}
.rns-color-hex:focus{outline:none;border-color:var(--rns-thumb);}
.rns-preview-stage{background:linear-gradient(160deg, #f1f5f9 0%, #e2e8f0 100%);border-radius:var(--rns-radius);padding:2rem;min-height:220px;display:flex;align-items:center;justify-content:center;}
.rns-preview-box{background:var(--rns-surface);border-radius:14px;width:140px;height:140px;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:0.875rem;color:var(--text-main);transition:box-shadow 0.15s ease;}
.rns-code-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.75rem;padding:0.75rem var(--rns-gap);border-top:1px solid var(--border);background:var(--surface-muted);}
.rns-code-title{font-size:0.9375rem;font-weight:600;color:var(--text-main);margin:0;}
.rns-code-actions{display:flex;gap:0.5rem;}
.rns-btn{padding:0.5rem 1rem;border-radius:8px;font-weight:500;font-size:0.875rem;cursor:pointer;border:none;transition:background 0.2s, color 0.2s;}
.rns-btn-copy{background:var(--border);color:var(--text-main);}
.rns-btn-copy:hover{background:var(--rns-muted);color:var(--rns-surface);}
.rns-btn-dl{background:var(--primary);color:#fff;}
.rns-btn-dl:hover{background:var(--primary-dark);}
.rns-code-block{background:#1e293b;color:#e2e8f0;padding:1.25rem var(--rns-gap);font-family:ui-monospace, monospace;font-size:0.8125rem;line-height:1.6;white-space:pre-wrap;overflow-x:auto;margin:0;}
.rns-android-only,.rns-ios-only{display:none;}
.rns-android-only[data-active="true"],.rns-ios-only[data-active="true"]{display:flex;flex-direction: column;}
.rns-android-only[data-active="true"]{display:flex;flex-direction:column;gap:1.25rem;}