.public-demo{min-height:100vh;color:#252820;background:#fbfaf7;font-family:Manrope,sans-serif}.public-demo-banner{display:flex;min-height:64px;align-items:center;justify-content:space-between;gap:18px;padding:10px clamp(16px,4vw,48px);color:#fff;background:#20231f}.public-demo-brand img{display:block;width:112px;max-height:32px}.public-demo-label{flex:1;font-size:13px;font-weight:700}.public-demo-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.public-demo-actions a,.public-demo-actions button{border:0;padding:8px 10px;color:inherit;background:transparent;font:inherit;font-size:12px;text-decoration:none;cursor:pointer}.public-demo-actions a:hover,.public-demo-actions button:hover{color:#ffc2ae}.public-demo-nav{display:flex;align-items:center;gap:4px;padding:10px clamp(16px,4vw,48px);overflow-x:auto;border-bottom:1px solid #e9e7e0;background:#fff}.public-demo-nav a,.public-demo-nav button{flex:0 0 auto;border:0;border-radius:7px;padding:9px 12px;color:#565a51;background:transparent;font:inherit;font-size:13px;text-decoration:none;cursor:pointer}.public-demo-nav a[aria-current=page]{color:#a63218;background:#fff0eb;font-weight:700}.public-demo-nav a:focus-visible,.public-demo-nav button:focus-visible,.public-demo-actions a:focus-visible,.public-demo-actions button:focus-visible,.public-demo-guide button:focus-visible,.public-demo-intro button:focus-visible{outline:3px solid #ef542a;outline-offset:2px}.public-demo-nav .public-demo-start-tour{margin-left:auto;color:#a63218;font-weight:700}.public-demo-warning{margin:12px clamp(16px,4vw,48px) 0;border-radius:8px;padding:10px 12px;color:#604818;background:#fff3d7;font-size:13px}.public-demo-intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:20px clamp(16px,4vw,48px) 0;border:1px solid #f1d6cb;border-radius:12px;padding:18px 22px;background:#fff6f1}.public-demo-intro h1{margin:0 0 5px;font-size:clamp(19px,2vw,25px)}.public-demo-intro p{margin:0;color:#5d6058;font-size:14px}.public-demo-intro-actions{display:flex;flex:0 0 auto;gap:8px}.public-demo-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,310px);align-items:start;gap:22px;padding:24px clamp(16px,4vw,48px) 48px}.public-demo-content{min-width:0}.public-demo-guide{position:sticky;top:18px;border:1px solid #e9e5dc;border-radius:12px;padding:18px;background:#fff;box-shadow:0 8px 24px #20231f14}.public-demo-guide:focus{outline:3px solid #ef542a;outline-offset:3px}.public-demo-guide-disclosure:not([open])>.public-demo-guide-body{display:block}.public-demo-guide-disclosure>summary{display:none}.public-demo-step{margin:0 0 9px;color:#a63218;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.public-demo-guide h2{margin:0 0 9px;font-size:20px}.public-demo-guide>p:not(.public-demo-step){margin:0 0 16px;color:#5d6058;font-size:14px;line-height:1.55}.public-demo-guide-controls{display:flex;flex-wrap:wrap;gap:8px}.public-demo-guide-controls .ui-button{flex:1 1 auto;justify-content:center}.public-demo-text-button{margin-top:12px;border:0;padding:5px 0;color:#a63218;background:transparent;font:inherit;font-size:13px;font-weight:700;cursor:pointer}.public-demo-complete{border-color:#cfd8bd;background:#f8fbf3}@media(max-width:850px){.public-demo-banner{align-items:flex-start;flex-wrap:wrap}.public-demo-label{flex:1 1 calc(100% - 140px);align-self:center}.public-demo-actions{justify-content:flex-start;width:100%}.public-demo-layout{grid-template-columns:minmax(0,1fr)}.public-demo-guide{position:static;grid-row:1}.public-demo-guide-disclosure>summary{display:list-item;cursor:pointer;font-weight:700}.public-demo-guide-disclosure:not([open])>.public-demo-guide-body{display:none}}@media(max-width:560px){.public-demo-banner{gap:8px}.public-demo-actions{gap:2px}.public-demo-actions a,.public-demo-actions button{padding:8px 6px;font-size:11px}.public-demo-intro{align-items:flex-start;flex-direction:column;padding:15px}.public-demo-intro-actions{width:100%;flex-wrap:wrap}.public-demo-intro-actions .ui-button{flex:1 1 150px}.public-demo-layout{padding-top:18px}}@media(prefers-reduced-motion:reduce){.public-demo *,.public-demo *:before,.public-demo *:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
