/* Shared Autolyrical interface tokens: also used by the desktop theme. */
:root{--product-bg:#131016;--product-panel:#1b1721;--product-raised:#292230;--product-line:#403648;--product-muted:#b5aabe;--product-purple:#a888d6;--product-lime:#e0edb5;--product-radius:6px;--background:var(--product-bg);--bg:var(--product-bg);--line:var(--product-line);--muted:var(--product-muted);--lime:var(--product-lime)}
.button,.nav-cta,.portal-button,.secondary-button,.media-settings button,.demo-switch button{border-radius:var(--product-radius);font-weight:500;letter-spacing:0;text-shadow:none;box-shadow:none;transition:background-color .16s,border-color .16s,color .16s}
.button.primary,.buy-button,.nav-cta,.portal-button{background:var(--product-lime);color:#24271d;border:1px solid transparent;font-weight:600}
.button.primary:hover,.buy-button:hover,.nav-cta:hover,.portal-button:hover{background:#ecf5cf;transform:none;box-shadow:none}
.button.primary:active,.buy-button:active,.nav-cta:active,.portal-button:active{background:#ccdda0;transform:none;box-shadow:none}
.secondary-button,.media-settings button{background:var(--product-raised);border:1px solid var(--product-line);color:#f5f1fb;font-size:12px}
.secondary-button:hover,.media-settings button:hover{background:#342b3e;border-color:#756187}
:where(button,a,input,select,textarea,summary):focus-visible{outline:2px solid #bd9ce7;outline-offset:4px}
.login-box input,#download-platform,.admin-card input,.admin-card select,.font-label select{background:#151219;border:1px solid var(--product-line);border-radius:var(--product-radius);color:#f5f1fb;box-shadow:none;font-weight:400}
.login-box input:hover,#download-platform:hover,.admin-card input:hover,.admin-card select:hover{border-color:#685773}
.login-panel{background:var(--product-bg)}.admin-card{background:var(--product-panel);border-color:var(--product-line);border-radius:10px}.admin-stats>div{border-color:var(--product-line);border-radius:8px}
.portal-button:disabled,.admin-card button:disabled{opacity:1;background:#292d23;color:#a4ae90;border-color:#3c4431;cursor:not-allowed}
.settings-dialog,dialog{border-color:#554460;background:var(--product-panel);border-radius:10px;box-shadow:0 24px 80px #0008}
/* The demonstrations are a small editing desk, using the hero's paper shapes. */
.demo-showcase{position:relative;isolation:isolate;padding:48px 0 8px;margin-top:46px;border-top:1px solid #4b3a59}
.demo-heading{margin-bottom:28px;align-items:end}.demo-heading h3{max-width:740px}.demo-heading .eyebrow{color:#bc9ddd}
.demo-era{margin-top:12px;color:#aea0bc;font-size:12px;line-height:1.5}
.demo-layout39{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;align-items:start}
.demo-sidebar39{position:relative;padding-top:12px}
.demo-switch{display:flex;flex-direction:column;padding:0;gap:10px;background:transparent;border:0;border-radius:0}
.demo-switch button{position:relative;display:grid;grid-template-columns:28px 1fr;gap:6px 12px;text-align:left;align-items:start;min-height:94px;width:100%;padding:18px 16px;border:1px solid #493952;border-radius:6px;background:#1b1721;color:#c1b3cf;box-shadow:none}
.demo-switch button .demo-index39{grid-row:1/3;font:500 12px/1.5 var(--font-body);color:#a98bc4;padding-top:1px}
.demo-switch button strong{font:600 15px/1.3 var(--font-body);letter-spacing:-.02em}
.demo-switch button small{font:400 12px/1.5 var(--font-body);color:#b5aabe;max-width:145px}
.demo-switch button:hover:not([aria-pressed=true]){background:#292230;border-color:#806199}
.demo-switch button[aria-pressed=true]{background:#a888d6;color:#21192a;border-color:#a888d6;box-shadow:none}
.demo-switch button[aria-pressed=true] :is(small,.demo-index39){color:#382948}
.demo-paper39{height:150px;position:relative;margin:35px 18px 0;pointer-events:none}
.demo-paper39 i{position:absolute;width:116px;height:83px;left:12px;top:12px;border:1px solid #a58bbd;border-radius:5px;background:#30243d;transform:rotate(-12deg);transition:transform .35s}
.demo-paper39 i:nth-child(2){left:32px;top:25px;transform:rotate(4deg);background:#a888d6;border-color:#c2a7e2}
.demo-paper39 i:nth-child(3){left:51px;top:37px;transform:rotate(14deg);background:#e0edb5;border-color:#e0edb5}
.demo-paper39 i:nth-child(3):before,.demo-paper39 i:nth-child(3):after{content:'';position:absolute;left:16px;top:26px;width:71px;height:4px;background:#324125;border-radius:2px}.demo-paper39 i:nth-child(3):after{top:39px;width:45px}
.demo-sidebar39:hover .demo-paper39 i:first-child{transform:rotate(-18deg) translateY(-3px)}.demo-sidebar39:hover .demo-paper39 i:nth-child(3){transform:rotate(19deg) translateY(-3px)}
.demo-main39{position:relative;min-width:0;padding:12px 0 0}
.demo-main39:before{content:'';position:absolute;z-index:-1;left:14px;right:-9px;top:0;bottom:82px;background:#38254d;border:1px solid #694b83;border-radius:9px;transform:rotate(1deg);pointer-events:none}
.demo-video-frame{border:1px solid #645171;border-radius:7px;box-shadow:0 15px 40px #0004;overflow:hidden;background:#131016}
.demo-window26{height:36px;padding:0 15px;background:#292230;border-bottom:1px solid #403648;color:#d3c3e2;font:500 11px/1 var(--font-body)}.demo-window-dots26 i{background:#806891}
.demo-stage .demo-play-disc{width:70px;height:70px;background:#21192ae6;border:1px solid #c0a1d969;box-shadow:none;color:#e0edb5;backdrop-filter:blur(4px)}
.demo-play:not(.is-playing):hover .demo-play-disc{background:#382948}
.demo-caption-row{padding:23px 3px 0;min-height:88px}.demo-caption-row h4{font-weight:800;font-size:clamp(23px,2.4vw,34px);text-transform:uppercase;color:#fff;letter-spacing:-.05em;line-height:1.05}.demo-caption-row h4 em{color:#b794e1}.demo-caption-row p{font-size:13px;line-height:1.6;margin-top:7px;color:#b5aabe}
@media(prefers-reduced-motion:no-preference){body:not(.motion-paused) .demo-panel:not([hidden]){animation:demo-enter39 .25s ease-out}@keyframes demo-enter39{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}}
@media(max-width:1000px){.demo-layout39{grid-template-columns:190px minmax(0,1fr);gap:20px}.demo-switch button{padding:15px 12px;grid-template-columns:22px 1fr;gap:5px 8px}.demo-paper39{margin-left:0;transform:scale(.9);transform-origin:left top}}
@media(max-width:760px){.demo-showcase{padding-top:32px;margin-top:34px}.demo-layout39{grid-template-columns:1fr;gap:20px}.demo-sidebar39{padding:0}.demo-switch{flex-direction:row;gap:10px;width:100%;overflow-x:auto}.demo-switch button{flex:1 0 112px;min-width:112px;min-height:90px;grid-template-columns:1fr}.demo-switch button .demo-index39{grid-row:auto}.demo-switch button strong{font-size:14px}.demo-switch button small{font-size:11px;max-width:none}.demo-paper39{display:none}.demo-main39{padding-top:6px}.demo-main39:before{right:-5px;left:8px;bottom:90px}.demo-caption-row{padding-top:20px}.demo-heading{margin-bottom:22px}.demo-stage .demo-play-disc{width:60px;height:60px}}
@media(prefers-reduced-motion:reduce){.demo-paper39 i,.demo-switch button{transition:none}.demo-sidebar39:hover .demo-paper39 i:first-child{transform:rotate(-12deg)}.demo-sidebar39:hover .demo-paper39 i:nth-child(3){transform:rotate(14deg)}}
body.motion-paused .demo-paper39 i{transition:none}body.motion-paused .demo-sidebar39:hover .demo-paper39 i:first-child{transform:rotate(-12deg)}body.motion-paused .demo-sidebar39:hover .demo-paper39 i:nth-child(3){transform:rotate(14deg)}