.app-loader[hidden] { display:none!important; }
.app-loader { position:fixed; inset:0; z-index:10000; pointer-events:none; }
.app-loader-line { position:absolute; inset:0 0 auto; height:3px; overflow:hidden; background:var(--blue-soft); }
.app-loader-line::after { content:''; position:absolute; width:40%; height:100%; background:linear-gradient(90deg,transparent,var(--blue),var(--success)); animation:app-loader-travel 1.6s ease-in-out infinite; }
.app-loader-panel { position:absolute; left:50%; bottom:32px; display:flex; align-items:center; gap:16px; width:max-content; max-width:calc(100vw - 32px); padding:18px 26px; transform:translateX(-50%); border:1px solid var(--line); border-radius:18px; background:var(--surface); color:var(--text); box-shadow:var(--shadow); animation:app-loader-appear .25s ease-out; }
.app-loader-mark { display:flex; align-items:center; gap:4px; width:34px; height:34px; }
.app-loader-mark span { width:7px; height:24px; border-radius:5px; background:var(--blue); animation:app-loader-pulse 1s ease-in-out infinite; }
.app-loader-mark span:nth-child(2) { height:32px; animation-delay:.12s; }
.app-loader-mark span:nth-child(3) { height:18px; background:var(--success); animation-delay:.24s; }
.app-loader-copy { display:flex; flex-direction:column; gap:4px; }
.app-loader-copy strong { font-size:.95rem; letter-spacing:-.03em; }
.app-loader-copy strong span { color:var(--blue); }
.app-loader-copy > span { color:var(--muted); font-size:.75rem; }
@keyframes app-loader-travel { from { transform:translateX(-100%); } to { transform:translateX(350%); } }
@keyframes app-loader-pulse { 0%,100% { transform:scaleY(.5); opacity:.55; } 50% { transform:scaleY(1); opacity:1; } }
@keyframes app-loader-appear { from { opacity:0; margin-bottom:-8px; } to { opacity:1; margin-bottom:0; } }
@media(max-width:575px) { .app-loader-panel { bottom: max(16px,env(safe-area-inset-bottom)); padding:14px 20px; } }
@media(prefers-reduced-motion:reduce) { .app-loader-panel,.app-loader-mark span,.app-loader-line::after { animation:none; } .app-loader-line::after { width:100%; } }
