html,body.f4e-demo-page{margin:0!important;width:100%;height:100%;overflow:hidden;background:#090d0f!important}
body.f4e-demo-page{--f4e-font:MiSans,"Mi Sans","PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;font-family:var(--f4e-font)}
.f4e-demo,.f4e-demo button,.f4e-demo input,.f4e-demo .f4e-copy h1,.f4e-demo .f4e-subline,.f4e-demo .f4e-choices{font-family:var(--f4e-font)!important}
.f4e-demo{isolation:isolate;background:radial-gradient(ellipse at 50% 43%,rgba(194,202,201,.065),transparent 26%),radial-gradient(circle at 50% 52%,#13181a 0,#0c1113 58%,#070a0b 100%)}
.f4e-demo .f4e-stone{fill:url(#f4eDemoStone);filter:url(#f4eDemoTexture)}
.f4e-demo .f4e-copy h1{font-weight:750;letter-spacing:.035em;font-size:clamp(18px,2.35vw,34px)}
.f4e-demo .f4e-subline{letter-spacing:.15em}
.f4e-demo .f4e-choices{width:min(100%,320px)}
.f4e-demo .f4e-choices button{appearance:none;display:flex;justify-content:center;column-gap:.3em;align-items:center;width:max-content;border:0;background:none;padding:5px 0;color:#a6b0b1;font:500 clamp(11px,.9vw,14px)/1.3 var(--f4e-font);letter-spacing:.06em;cursor:pointer;text-transform:lowercase}
.f4e-demo .f4e-choices button .f4e-choice-label{justify-self:end;color:#a6b0b1;text-align:right}
.f4e-demo .f4e-choices button .f4e-keycap{display:inline-flex;align-items:center;justify-content:center;justify-self:start;box-sizing:border-box;min-width:46px;height:23px;margin-left:0;padding:0 7px;border:1px solid rgba(166,176,177,.72);border-radius:3px;color:#a6b0b1;font:600 9px/1 var(--f4e-font);letter-spacing:.08em;text-transform:uppercase;vertical-align:middle}
.f4e-demo .f4e-choices button[data-entry="index"] .f4e-keycap{min-width:23px;width:23px;padding:0}
.f4e-demo .f4e-choices button:hover{color:#e0e3dc}
.f4e-demo .f4e-intro{position:absolute;inset:0;z-index:30;pointer-events:none}
.f4e-demo .f4e-choices{pointer-events:auto}
.f4e-demo .f4e-logo-shell{z-index:30;transition:left 1.45s cubic-bezier(.22,1,.36,1),top 1.45s cubic-bezier(.22,1,.36,1),width 1.45s cubic-bezier(.22,1,.36,1),transform 1.45s cubic-bezier(.22,1,.36,1)}
.f4e-demo .f4e-logo{display:block;margin:0 auto;transition:width 1.45s cubic-bezier(.22,1,.36,1)}
.f4e-demo.is-titled .f4e-logo-shell{top:39%;transform:translate(-50%,-56%) scale(.79)}
.f4e-demo.is-ready .f4e-choices,.f4e-demo.is-ready .f4e-corner-note{opacity:1}
.f4e-demo.is-entering .f4e-copy,.f4e-demo.is-entering .f4e-choices,.f4e-demo.is-entering .f4e-corner-note{opacity:0;pointer-events:none}
.f4e-demo.is-entering .f4e-logo-shell{left:var(--brand-left);top:var(--brand-top);width:var(--brand-width);transform:none;opacity:1}
.f4e-demo.is-entering .f4e-logo{width:var(--logo-width)}
.f4e-terminal-brand{display:flex;flex-direction:column;align-items:center;text-align:center;color:#e0e3dc;opacity:0;visibility:hidden;transition:opacity .5s .65s}
.f4e-demo.is-entering .f4e-terminal-brand{opacity:1;visibility:visible}
.f4e-brand-name{font:750 var(--brand-font)/1.1 var(--f4e-font);white-space:nowrap;letter-spacing:0}
.f4e-brand-system{font:500 12px/1.3 var(--f4e-font);white-space:nowrap;margin-top:var(--brand-gap);letter-spacing:0;color:#a6b0b1}
.f4e-terminal-layer{position:absolute;inset:0;z-index:15;opacity:0;visibility:hidden;transition:opacity .65s ease}
.f4e-demo.is-terminal .f4e-terminal-layer{opacity:1;visibility:visible}
.f4e-demo.is-terminal .f4e-atmosphere{opacity:0;transition:opacity .65s}
.f4e-demo.is-index .f4e-intro{filter:blur(5px);opacity:.4}
.f4e-demo.is-index .f4e-terminal-layer{opacity:1;visibility:visible;z-index:42;transition:none}
.f4e-demo.is-index #viewport,.f4e-demo.is-index #stage{background:transparent;box-shadow:none}
.f4e-demo.is-index #stage> :not(#modal-root){visibility:hidden;pointer-events:none}
.f4e-loader{position:absolute;z-index:50;left:50%;top:52%;width:min(410px,72vw);transform:translate(-50%,-50%);opacity:0;visibility:hidden;color:#bfc6c5;font:500 12px/1.4 var(--f4e-font);letter-spacing:.09em;transition:opacity .35s;pointer-events:none}
.f4e-loader-label{text-align:center}
.f4e-loader-rule{height:1px;margin:18px 0 11px;background:rgba(188,199,197,.18);overflow:hidden}
.f4e-loader-rule i{display:block;width:0;height:100%;background:#c5a16b;transition:width .4s}
.f4e-loader-meta{display:flex;justify-content:space-between;color:#879294;font-size:9px}
.f4e-demo.is-loading .f4e-loader{opacity:1;visibility:visible}
@media(max-width:780px){
  .f4e-demo .f4e-copy{top:45%}
  .f4e-demo .f4e-choices{top:58%}
}
@media(prefers-reduced-motion:reduce){.f4e-demo .f4e-logo-shell,.f4e-demo .f4e-logo,.f4e-terminal-layer,.f4e-terminal-brand{transition-duration:.01ms;transition-delay:0s}}


/* Center each complete row independently, including its shortcut key. */
.f4e-demo .f4e-subline{display:flex;justify-content:center;column-gap:1em;align-items:center}
.f4e-demo .f4e-subline>span{margin:0;color:inherit;white-space:nowrap}
.f4e-demo .f4e-axis-left{justify-self:end}
.f4e-demo .f4e-axis-right{justify-self:start}
.f4e-demo .f4e-axis-separator{justify-self:center;letter-spacing:0}
.f4e-demo .f4e-subline>.f4e-axis-separator{color:#5f5b55}
.f4e-demo .f4e-choice-label{white-space:nowrap}
.f4e-demo .f4e-choice-end{display:flex;align-items:center;justify-self:start;gap:8px;white-space:nowrap}
/* The timeout notice is independent of the existing loading composition. */
.f4e-demo .f4e-load-timeout{position:fixed;z-index:60;right:24px;bottom:var(--f4e-timeout-bottom,24px);width:min(340px,calc(100vw - 32px));box-sizing:border-box;padding:16px 18px;background:rgba(15,22,25,.96);border:1px solid rgba(197,161,107,.55);color:#bfc6c5;font:400 12px/1.8 var(--f4e-font);letter-spacing:.02em;pointer-events:auto}
.f4e-demo .f4e-load-timeout[hidden]{display:none!important}
.f4e-load-timeout p{margin:0 0 12px;font:inherit}
.f4e-load-timeout .f4e-timeout-title{color:#d6b782;font-weight:600}
.f4e-demo .f4e-load-timeout button{appearance:none;border:1px solid rgba(197,161,107,.65);padding:7px 12px;background:transparent;color:#e0e3dc;font:inherit;cursor:pointer}
.f4e-demo .f4e-load-timeout button:hover{border-color:#e0e3dc}
.f4e-demo .f4e-load-timeout button:focus-visible{outline:2px solid #c5a16b;outline-offset:3px}
@media(max-width:780px){.f4e-demo .f4e-load-timeout{right:16px;padding:14px 16px}}