html,body{margin:0;height:100%;background:#000;overflow:hidden;font:13px system-ui;color:#ccc}
canvas{width:100%;height:100%;display:block;outline:none}
#loading{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#000;z-index:10}
#bar{overflow:hidden;width:min(400px,85vw);height:16px;border:1px solid #fff}
#fill{height:100%;width:0;background:#fff}

#loading.selecting-install{box-sizing:border-box;justify-content:flex-start;overflow:auto;padding:clamp(32px,8vh,80px) 24px;background:#142630;color:#f1ead9;gap:16px}
#loading.selecting-install h1{font:normal clamp(48px,9vw,76px)/1 Georgia,serif;margin:0;color:#d9ba78}
#loading.selecting-install #label{font:normal 24px/1.3 Georgia,serif;text-align:center}
#loading.selecting-install #bar{display:none}
#install-picker{display:flex;flex-direction:column;gap:20px;width:min(480px,100%);font:16px/1.6 system-ui}
#install-picker p{margin:0}
#install-picker input,#install-picker button{box-sizing:border-box;width:100%;font:inherit;padding:12px 16px;border:1px solid #80949b;border-radius:4px}
#install-picker button{background:#203b49;color:#f1ead9;cursor:pointer}
#install-picker button.primary{background:#d9ba78;border-color:#d9ba78;color:#142630;font-weight:650}
#install-picker button:hover:not(:disabled){filter:brightness(1.12)}
#install-picker button:disabled{opacity:.65;cursor:wait}
#install-picker :focus-visible{outline:3px solid #f1ead9;outline-offset:4px}
#install-picker input{background:#0e1c24;color:#f1ead9}
#install-picker input::placeholder{color:#a7b8bf}
#install-picker details{border-top:1px solid #526872;padding-top:16px}
#install-picker summary{cursor:pointer;color:#d9ba78}
#install-picker details label{display:block;margin-top:16px}
#install-picker details p{font-size:14px;color:#bfccd0;margin:12px 0}
#install-picker [role="status"]{color:#d9ba78;overflow-wrap:anywhere}
#install-picker [role="alert"]{color:#ffb7a9;overflow-wrap:anywhere}
#install-picker [role="status"]:empty,#install-picker [role="alert"]:empty{display:none}
#fill.indeterminate{width:25%!important;animation:loading-progress 1s ease-in-out infinite alternate}
@keyframes loading-progress{from{transform:translateX(0)}to{transform:translateX(300%)}}

@media(prefers-reduced-motion:reduce){#fill.indeterminate{animation:none}}