.real-demo{margin-top:35px}.real-demo-tabs{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px;padding-bottom:20px;display:flex}.real-demo-tabs button{color:#c6d0be;background:#20271d;border:1px solid #44503c;border-radius:7px;padding:12px 21px;font-size:13px}.real-demo-tabs button[aria-pressed=true]{background:var(--accent);color:#20251c;border-color:var(--accent)}.real-demo-label{letter-spacing:.09em;color:#a6b499;margin-left:auto;font-size:9px}.real-demo-intro{justify-content:space-between;align-items:center;gap:25px;padding:27px 0 23px;display:flex}.real-demo-intro h2{letter-spacing:-.04em;font-size:26px}.real-demo-intro p{max-width:700px;margin-top:12px;font-size:13px;line-height:1.8}.real-demo-intro>a{white-space:nowrap;color:var(--accent)}.real-demo-notice{color:#b2c0a5;background:#20271d;border:1px solid #3e4937;border-radius:8px;align-items:center;gap:10px;padding:13px 16px;font-size:11px;display:flex}.real-demo-notice>.live-dot{flex-shrink:0}.real-demo-notice>button{color:#ecc0a5;white-space:nowrap;background:0 0;border:0;margin-left:auto;font-size:12px}.real-demo-shortcuts{flex-wrap:wrap;align-items:center;gap:8px;padding:18px 0;display:flex}.real-demo-shortcuts button{color:#b1bda5;background:0 0;border:1px solid #44503c;border-radius:5px;padding:7px 15px;font-size:11px}.real-demo-shortcuts button[aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.real-demo-shortcuts>span{color:#829475;margin-left:auto;font-size:10px}.real-demo-stage{background:#121512;border:1px solid #4c5742;border-radius:12px;min-height:800px;margin-top:5px;position:relative;overflow:hidden}.real-demo-stage iframe{opacity:0;background:#121512;border:0;width:100%;height:820px;display:block}.real-demo-stage iframe.is-ready{opacity:1}.real-demo-loading,.real-demo-failure{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:15px;padding:30px;display:flex;position:absolute;inset:0}.real-demo-loading p{color:#d9e0d3;font-size:15px}.real-demo-loading small{color:#93a387;font-size:11px}.real-demo-skeleton{background:linear-gradient(90deg,#222b1d,#36432e,#222b1d) 0 0/200% 100%;border-radius:12px;width:min(400px,90%);height:160px;animation:1.5s infinite shimmer}.real-demo-failure h3{font-size:30px}.real-demo-failure p{max-width:470px;font-size:13px}.real-demo-mobile{border:8px solid #30392b;border-radius:28px;max-width:430px;min-height:820px;margin:25px auto 0;box-shadow:0 15px 50px #0003}.real-demo-mobile iframe{background:#f3f9f9;height:844px}.real-demo-footnote{max-width:850px;margin-top:20px;font-size:11px;line-height:1.8}.real-demo-footnote a{color:var(--accent)}.actual-admin-preview img{width:100%;height:auto;display:block}.actual-member-preview img{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.actual-preview-link{display:block}.actual-preview-link:focus-visible{outline:2px solid var(--accent)}@media (min-width:1400px){.demo-page.wrap{max-width:1480px}}@media (max-width:700px){.real-demo-intro{flex-direction:column;align-items:flex-start;gap:16px}.real-demo-intro h2{font-size:25px}.real-demo-label{width:100%;margin-top:9px;margin-left:0;font-size:8px}.real-demo-notice{flex-wrap:wrap;align-items:flex-start;font-size:10px}.real-demo-notice>span:nth-child(2){flex:1}.real-demo-notice>button{margin-left:18px}.real-demo-shortcuts>span{width:100%;margin-left:0}.real-demo-stage,.real-demo-mobile{min-height:760px}.real-demo-stage iframe{height:780px}.real-demo-mobile{border-width:4px;margin-inline:-5px}.real-demo-footnote{font-size:10px}}.refresh-demo-page .real-demo-tabs button{min-height:48px;font-size:14px}.refresh-demo-page .real-demo-intro h2{font-size:28px}.refresh-demo-page .real-demo-intro p{font-size:15px}.refresh-demo-page .real-demo-label{color:#9cac8f;font-size:9px}.refresh-demo-page .real-demo-notice{padding:16px;font-size:12px;line-height:1.7}.refresh-demo-page .real-demo-notice>button{min-height:44px;font-size:13px}.refresh-demo-page .real-demo-shortcuts button{min-height:44px;font-size:12px}.refresh-demo-page .real-demo-footnote{font-size:13px;line-height:1.8}.refresh-demo-page .real-demo-shortcuts>span{font-size:11px}.refresh-demo-page .real-demo-failure p{font-size:15px}@media (max-width:650px){.refresh-demo-page .real-demo-tabs button{padding-inline:17px;font-size:13px}.refresh-demo-page .real-demo-label{font-size:8px}.refresh-demo-page .real-demo-intro h2{font-size:26px}.refresh-demo-page .real-demo-intro p{font-size:15px}.refresh-demo-page .real-demo-notice{padding:13px;font-size:12px}.refresh-demo-page .real-demo-footnote{font-size:12px}}