/* Startup card: the progress value is supplied by completed application work. */
body:has(#loading){background:#080f19}body:has(#loading) #ux,body:has(#loading)>header,body:has(#loading)>.navigation,body:has(#loading)>.mode-nav,body:has(#loading)>footer{visibility:hidden}
#loading{isolation:isolate;position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:#080f19;color:#eef1f8;overflow:hidden;font-family:"IBM Plex Sans",system-ui,sans-serif;transition:opacity .65s ease,visibility .65s}
#loading .loading-map{position:absolute;inset:-30px;z-index:-3;background:url('./assets/loading/barcelona-dark.svg') center/cover no-repeat;filter:blur(5px) brightness(1.12);opacity:.78;transform:scale(1.05)}
#loading .loading-atmosphere{position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 50% 45%,#09121c00 25%,#040a1366 100%),linear-gradient(180deg,#08111a0a,#050b1433)}
#loading .loading-card{box-sizing:border-box;position:relative;width:min(540px,calc(100vw - 40px));padding:34px 38px 28px;border:1px solid #ffffff1a;border-radius:20px;background:linear-gradient(145deg,#0c1422f5,#0a101bf7);box-shadow:0 20px 60px #0006,inset 0 1px 0 #ffffff06;backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
#loading .loading-location{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 20px;color:#aab6c9;font-size:10px;letter-spacing:2.3px;font-weight:600;line-height:1.4}
#loading .loading-coordinates{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px;font-weight:500;letter-spacing:.35px;color:#63728b;white-space:nowrap}
#loading .loading-brand{display:flex;align-items:center;justify-content:flex-start;gap:17px}
#loading .load-mark{box-sizing:border-box;position:relative;display:flex;align-items:flex-end;width:56px;height:56px;flex:none;padding:5px 4px 7px;background:#ff7900;border-radius:10px;color:white;font-family:Arial,sans-serif;font-size:20px;font-weight:700;letter-spacing:-1.6px;line-height:1;box-shadow:0 8px 22px #ff79002d}
#loading .load-mark>span{position:absolute;font-size:6px;right:5px;bottom:23px;letter-spacing:0}
#loading .loading-eyebrow{display:block;font-size:10px;font-weight:600;letter-spacing:2px;color:#ff8b15;margin-bottom:3px;line-height:1.4}
#loading h2{font-size:24px;line-height:1.15;letter-spacing:-.9px;font-weight:600;margin:0;color:#f0f2f8;white-space:nowrap}
#loading .loading-intro{font-size:11px;color:#aab7ca;text-align:left;margin:5px 0 0;letter-spacing:.1px;line-height:1.4}
#loading .loading-progress-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:40px 0 15px}
#loading .loading-progress-copy{min-width:0;flex:1}
#loading #progress{font-size:12px;font-weight:400;color:#d0d9e6;line-height:1.4;margin:0;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:18px}
#loading .loading-progress-detail{display:block;margin-top:3px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;letter-spacing:.15px;color:#9aaac0;line-height:1.4}
#loading #loading-percent{flex:none;font-size:30px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-1.5px;color:#f3f3fa}
#loading #loading-percent>span{font-size:12px;font-weight:500;color:#b0bbce;margin-left:2px;letter-spacing:0}
#loading .track{position:relative;box-sizing:border-box;height:7px;width:100%;margin:0;background:#1d2533;border:1px solid #ffffff13;border-radius:20px;overflow:hidden}
#loading .track i{position:relative;display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#cd6527 0%,#ee862e 55%,#d9a16b 100%);box-shadow:none;transition:width .45s cubic-bezier(.22,.75,.2,1)}
#loading .track i:after{display:none;content:"";position:absolute;right:0;top:0;bottom:0;width:14px;border-radius:inherit;background:linear-gradient(90deg,transparent,#fff0c780);filter:blur(2px)}
#loading .loading-stages{display:flex;justify-content:space-between;gap:10px;margin-top:12px;font-size:10px;font-weight:600;line-height:1.4;color:#626b7d;letter-spacing:.9px;text-transform:uppercase}
#loading .loading-stages span{display:flex;align-items:center;gap:8px}
#loading .loading-stages span:before{content:"";width:6px;height:6px;border-radius:50%;background:#424a5a;flex:none}
#loading .loading-stages .done{color:#c6cfde}#loading .loading-stages .done:before{background:#ffb875}
#loading .loading-stages .current{color:#e0e5ef}#loading .loading-stages .current:before{background:#ff7900;box-shadow:0 0 9px #ff790088;animation:loading-pulse 1.6s ease-in-out infinite}
#loading .loading-signature{margin-top:26px;padding-top:20px;border-top:1px solid #ffffff13;display:flex;gap:9px;align-items:center;justify-content:flex-start;color:#acb9cc;font-size:10px;line-height:1.5}
#loading .loading-pulse{width:6px;height:6px;background:#86441f;border-radius:50%;box-shadow:0 0 8px #ff790025;flex:none}
#loading .loading-timing{margin-left:auto;white-space:nowrap;color:#63728b;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:9px;letter-spacing:.2px}
#loading .loading-footer{position:absolute;bottom:18px;left:24px;right:24px;text-align:center;font-size:8px;letter-spacing:.25px;color:#4e6075}
#loading.is-leaving{opacity:0;pointer-events:none}#loading.is-leaving .loading-card{transform:translateY(-6px);transition:transform .65s ease}
#loading.is-error .loading-stages .current:before{animation:none;background:#f38352}
#loading #loading-retry{border:1px solid #ff98396b;border-radius:8px;background:#ff7900;color:#101721;font:inherit;font-size:12px;font-weight:600;padding:10px 18px;margin:20px 0 0;cursor:pointer}
#loading #loading-retry:not([hidden]){display:block}
@keyframes loading-pulse{50%{box-shadow:0 0 12px #ff7900bb;opacity:.55}}
@media(max-width:540px){#loading .loading-card{padding:30px 26px 26px}#loading .loading-location{font-size:9px;letter-spacing:1.8px}#loading .loading-coordinates{font-size:8px}#loading .loading-brand{gap:16px}#loading h2{font-size:clamp(18px,4.5vw,24px);letter-spacing:-.5px}#loading .load-mark{width:52px;height:52px;font-size:19px}#loading .load-mark>span{bottom:22px}#loading .loading-eyebrow{font-size:8px;letter-spacing:1.6px}#loading .loading-intro{font-size:10px}#loading .loading-progress-head{margin-top:32px}#loading #loading-percent{font-size:28px}#loading .loading-stages{font-size:8px;letter-spacing:.5px;gap:6px}#loading .loading-stages span{gap:5px}#loading .loading-signature{font-size:10px;gap:7px}#loading .loading-timing{font-size:8px}}
@media(max-width:380px){#loading .loading-card{width:calc(100vw - 24px);padding:25px 18px}#loading .loading-coordinates{font-size:7px}#loading .loading-brand{gap:12px}#loading .load-mark{width:52px;height:55px;font-size:19px}#loading .loading-timing{display:none}}
@media(prefers-reduced-motion:reduce){#loading,#loading .track i,#loading .loading-card{transition:none!important}#loading .loading-stages .current:before{animation:none}}

/* Original Orange artwork, always square; never compress the wordmark. */
#loading img.load-mark{display:block;width:56px;height:56px;aspect-ratio:1;object-fit:contain;padding:0;border-radius:0;background:none;overflow:visible;flex:0 0 auto}
@media(max-width:540px){#loading img.load-mark{width:52px;height:52px}}
