/* Bank Senoa v2.8.0 — Live Demo Sandbox */
.demo-ribbon{display:grid;grid-template-columns:minmax(240px,1fr) auto auto;align-items:center;gap:14px;margin-bottom:18px;padding:13px 15px;border:1px solid rgba(91,225,188,.28);border-radius:18px;background:linear-gradient(135deg,rgba(31,198,155,.10),rgba(55,119,255,.08));box-shadow:inset 0 1px rgba(255,255,255,.03)}
.demo-ribbon-copy{display:flex;align-items:center;gap:11px;min-width:0}.demo-ribbon-copy>div{min-width:0}.demo-ribbon-copy b{display:block;font-size:12px;letter-spacing:.12em;color:#7af1d0}.demo-ribbon-copy small{display:block;margin-top:3px;color:#9fb0cd;line-height:1.45;white-space:normal}.demo-live-dot{width:11px;height:11px;border-radius:50%;background:#39d8a9;box-shadow:0 0 0 5px rgba(57,216,169,.10);flex:none}
.demo-role-switch,.demo-ribbon-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.demo-role-switch form,.demo-ribbon-actions form{margin:0}.demo-role-btn,.demo-action-btn{min-height:36px;border:1px solid rgba(255,255,255,.09);border-radius:11px;padding:8px 10px;background:#0b172c;color:#b8c6df;font-weight:800;font-size:11px;line-height:1;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.demo-role-btn:hover,.demo-action-btn:hover{border-color:rgba(105,132,255,.5);color:#fff}.demo-role-btn.active{background:linear-gradient(135deg,#2d82ff,#7047ff);border-color:transparent;color:#fff}.demo-action-btn.danger{color:#ffb4c2;border-color:rgba(255,92,118,.24);background:rgba(255,92,118,.08)}
.live-demo-public{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(310px,.95fr);gap:22px;align-items:start}.live-demo-card{padding:32px}.live-demo-card h1{margin:14px 0 12px;font-size:clamp(36px,5vw,58px);line-height:1;letter-spacing:-.055em}.live-demo-card>p{color:#a7b5cf;line-height:1.8;font-size:16px}.demo-check-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:24px 0}.demo-check{display:flex;gap:10px;padding:14px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.06)}.demo-check i{font-style:normal;color:#64e5c1;font-weight:950}.demo-check b{display:block;font-size:13px}.demo-check span{display:block;margin-top:3px;color:#91a2c0;font-size:11px;line-height:1.45}.demo-preview-stack{display:grid;gap:14px}.demo-preview-card{padding:20px;border-radius:22px;background:linear-gradient(160deg,#0d1a34,#11183a);border:1px solid rgba(255,255,255,.08)}.demo-preview-card small{display:block;color:#8295b7;text-transform:uppercase;letter-spacing:.1em;font-size:10px}.demo-preview-card strong{display:block;margin:8px 0 4px;font-size:26px}.demo-preview-card p{margin:0;color:#9aabc7;font-size:12px;line-height:1.55}.demo-start-note{margin-top:15px;color:#8fa1bf;font-size:12px;line-height:1.6}.demo-reset-notice{width:min(1200px,calc(100% - 36px));margin:14px auto 0;padding:12px 14px;border:1px solid rgba(55,215,164,.2);border-radius:14px;background:rgba(55,215,164,.08);color:#aef3dc;font-size:13px}
@media(max-width:1100px){.demo-ribbon{grid-template-columns:1fr}.demo-role-switch,.demo-ribbon-actions{justify-content:flex-start}.live-demo-public{grid-template-columns:1fr}}
@media(max-width:720px){.demo-ribbon{padding:12px;border-radius:15px}.demo-role-switch{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.demo-role-switch form{min-width:0}.demo-role-btn{width:100%;min-height:42px}.demo-ribbon-actions{display:grid;grid-template-columns:1fr 1fr;width:100%}.demo-ribbon-actions form,.demo-action-btn{width:100%}.live-demo-card{padding:22px}.demo-check-grid{grid-template-columns:1fr}.demo-reset-notice{width:min(100% - 24px,1200px)}}