/* Semantic colors keep controls, editors and feedback readable in both themes. */
:root {
  color-scheme: dark;
  --bg:#111318; --sidebar:#15171d; --surface:#191c23; --surface-alt:#161920; --surface-hover:#23262e;
  --border:#30343f; --border-strong:#444b5b; --focus-border:#697287;
  --text:#ebedf3; --text-soft:#c9ceda; --muted:#a0a7b7;
  --accent:#e65772; --accent-ink:#f0bec9; --accent-soft:#e6577213; --eyebrow:#d49aaa;
  --green:#81cfaa; --red:#f28d9b; --button:#252932; --button-hover:#303541; --input:#13161c;
  --focus-ring:#e6577225; --primary:#b53350; --primary-hover:#c33b59; --primary-border:#df5571;
  --positive-text:#a0e0bd; --positive-bg:#1c332c; --positive-border:#416c56; --positive-hover:#264638;
  --terminal:#101318; --terminal-toolbar:#14171d; --terminal-text:#bac3d2;
  --notice-bg:#24392e; --notice-text:#c9e8d5; --notice-border:#49765a;
  --error-bg:#3a242b; --error-text:#ffccd6; --error-border:#824754; --shadow:#0008; --backdrop:#07090bd9;
  --font:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg:#f3f5f9; --sidebar:#ffffff; --surface:#ffffff; --surface-alt:#f3f5f9; --surface-hover:#e9edf4;
  --border:#d7dce5; --border-strong:#adb7c8; --focus-border:#6f7a8c;
  --text:#202936; --text-soft:#3d485b; --muted:#5d687a;
  --accent:#bd3453; --accent-ink:#9e2642; --accent-soft:#fce9ee; --eyebrow:#9d3450;
  --green:#28784c; --red:#ad2844; --button:#f0f3f8; --button-hover:#e5eaf2; --input:#f9fafc;
  --focus-ring:#bd34531c; --primary:#ac2e4a; --primary-hover:#92223b; --primary-border:#ac2e4a;
  --positive-text:#22683e; --positive-bg:#eaf6ef; --positive-border:#9dc6ac; --positive-hover:#d9eddf;
  --terminal:#f6f8fb; --terminal-toolbar:#edf1f6; --terminal-text:#344156;
  --notice-bg:#eaf6ed; --notice-text:#205833; --notice-border:#8cb89b;
  --error-bg:#fcedef; --error-text:#9b2340; --error-border:#d28d9c; --shadow:#23304a20; --backdrop:#1b233ad4;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 var(--font)}
button,input,textarea{font:inherit}
button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;color:var(--text);background:var(--button);border:1px solid var(--border-strong);border-radius:7px;padding:9px 14px;font-size:13px;font-weight:550;text-decoration:none;white-space:nowrap}
button:hover,.button:hover{background:var(--button-hover);border-color:var(--focus-border)}
button:disabled{opacity:.5;cursor:wait}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
input,textarea{width:100%;padding:11px 12px;border:1px solid var(--border-strong);border-radius:6px;background:var(--input);color:var(--text);outline:none}
input:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus-ring)}
label{display:block;font-size:13px;font-weight:500;color:var(--text-soft)}
label input{display:block;margin-top:7px}
input[type=checkbox]{width:auto;margin:0;accent-color:var(--accent)}
.primary{background:var(--primary);border-color:var(--primary-border);color:#fff}
.primary:hover{background:var(--primary-hover);border-color:var(--primary-border)}
.positive{color:var(--positive-text);background:var(--positive-bg);border-color:var(--positive-border)}
.positive:hover{background:var(--positive-hover)}
.danger-subtle{color:var(--red)}
.icon-button{padding:7px 10px;background:transparent;border-color:transparent;font-size:19px}
.wide{width:100%}
.muted{color:var(--muted)}
.optional{color:var(--muted);font-weight:400;font-size:11px;margin-left:5px}
h1,h2,h3,p{margin:0}
h1{font-size:30px;line-height:1.2;font-weight:650;letter-spacing:-1px}
h2{font-size:16px;font-weight:600;letter-spacing:-.2px}
h3{font-size:15px;margin-bottom:8px}
.eyebrow{font-size:10px;letter-spacing:1.65px;font-weight:650;color:var(--eyebrow);margin-bottom:12px}
.brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:700;letter-spacing:-.55px;white-space:nowrap}
.gem{color:var(--accent);font-size:29px;line-height:1}
.brand-light{font-size:15px;font-weight:400;color:var(--muted);letter-spacing:-.4px}
.app-shell{min-height:100vh;display:grid;grid-template-columns:235px minmax(0,1fr)}
.sidebar{display:flex;flex-direction:column;background:var(--sidebar);border-right:1px solid var(--border);padding:32px 18px 20px;min-height:100vh;position:sticky;top:0;height:100vh}
.sidebar>.brand{padding:0 8px}
.instance-selector{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:9px;padding:12px 10px;margin:36px 0 30px}
.instance-selector strong{font-size:12px;display:block;max-width:127px;overflow:hidden;text-overflow:ellipsis}
.instance-selector small,.sidebar-footer small{font-size:11px;color:var(--muted);display:block;margin-top:2px}
.instance-icon{border-radius:6px;background:var(--button);padding:5px 10px;color:var(--text-soft);font-size:20px}
.status-dot{width:6px;height:6px;background:var(--muted);border-radius:50%;margin-left:auto;flex:none}
.status-dot.online{background:var(--green)}
.nav-label{font-size:9px;letter-spacing:1.5px;color:var(--muted);margin:0 14px 10px;font-weight:650}
nav{display:grid;gap:5px}
.nav-item{border:0;justify-content:start;background:none;color:var(--text-soft);font-size:12px;font-weight:500;padding:12px 14px;gap:12px}
.nav-item>span{font-size:18px;width:17px;line-height:1}
.nav-item:hover{background:var(--surface-hover)}
.nav-item.active{color:var(--accent-ink);background:var(--accent-soft);box-shadow:inset 2px 0 var(--accent)}
.sidebar-footer{display:flex;align-items:center;gap:9px;margin-top:auto;padding:20px 5px 0;border-top:1px solid var(--border)}
.sidebar-footer strong{font-size:12px;max-width:115px;display:block;overflow:hidden;text-overflow:ellipsis}
.sidebar-footer .icon-button{margin-left:auto}
.avatar{display:flex;align-items:center;justify-content:center;width:30px;height:32px;background:var(--button-hover);border-radius:7px;color:var(--text-soft);font-weight:600}
.workspace{min-width:0}
.topbar{height:74px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 40px;font-size:12px}
.breadcrumb-divider{color:var(--muted);margin:0 13px}
.private-label{display:flex;gap:7px;color:var(--muted);font-size:11px}
.content{padding:35px 40px 20px;max-width:1480px;margin:auto}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 29px}
.page-heading .muted{margin-top:12px;font-size:13px}
.badge{font-size:11px;display:inline-flex;border:1px solid var(--border-strong);border-radius:20px;padding:5px 11px;color:var(--text-soft);white-space:nowrap}
.badge.online{background:var(--positive-bg);border-color:var(--positive-border);color:var(--positive-text)}
.summary-grid{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:16px;margin-bottom:26px}
.summary-card{padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-radius:9px;min-width:0}
.summary-card>p{font-size:9px;color:var(--muted);letter-spacing:1.2px;font-weight:550;margin-bottom:14px}
.summary-card>strong{font-size:21px;font-weight:600;display:block;line-height:1.4}
.summary-card>strong.small-value{font-size:15px;line-height:29px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.summary-card>small{display:block;font-size:11px;color:var(--muted);margin-top:5px}
#server-runtime{overflow-wrap:anywhere}
.card{border:1px solid var(--border);border-radius:9px;background:var(--surface);overflow:hidden;margin-bottom:22px}
.card-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:21px 24px;border-bottom:1px solid var(--border)}
.card-header p.muted{font-size:11px;margin-top:4px}
.actions{display:flex;gap:7px;align-items:center}
.actions button{padding:8px 11px;font-size:11px}
.terminal-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 22px;background:var(--terminal-toolbar);border-bottom:1px solid var(--button);color:var(--muted);font:10px ui-monospace,SFMono-Regular,Consolas,monospace}
.tiny-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--eyebrow);margin-right:7px}
.inline-label{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);font-family:var(--font)}
.terminal{padding:22px;margin:0;background:var(--terminal);min-height:300px;height:calc(100vh - 550px);max-height:650px;overflow:auto;font:12px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--terminal-text);white-space:pre-wrap;overflow-wrap:anywhere;tab-size:4}
.command-line{display:flex;align-items:center;background:var(--terminal-toolbar);border-top:1px solid var(--border);padding:11px 17px;gap:12px}
.command-line>span{color:var(--accent);font-weight:700}
.command-line input{border:0;background:none;padding:6px 0;font-size:12px;box-shadow:none}
.command-line button{background:var(--button);border-color:var(--border-strong);font-size:11px;padding:6px 12px}
.card-note{font-size:10px;color:var(--muted);padding:13px 22px;border-top:1px solid var(--border)}
.workspace-footer{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:32px;padding-top:20px;border-top:1px solid var(--border)}
.file-path{display:flex;align-items:center;gap:12px;min-width:0}
.file-path code{overflow-wrap:anywhere}
.table-scroll{overflow:auto}
table{border-collapse:collapse;width:100%;text-align:left}
th{padding:12px 24px;font-size:10px;letter-spacing:.7px;color:var(--muted);font-weight:500;background:var(--surface-alt)}
td{padding:12px 24px;font-size:12px;border-top:1px solid var(--border)}
td:last-child{white-space:nowrap}
td button,td a{font-size:11px;margin-right:6px;padding:5px 9px}
.file-name{background:none;border:0;color:var(--text-soft);text-align:left;white-space:normal;overflow-wrap:anywhere;padding-left:0}
.file-name:hover{background:none;color:var(--accent-ink)}
.file-name.folder{color:var(--accent-ink)}
.empty-row{text-align:center;padding:38px;color:var(--muted)}
.padded{padding:24px}
.padded>h2{margin-bottom:14px}
.padded>p{font-size:12px;max-width:720px}
.compact-form{display:grid;gap:17px;max-width:410px;margin-top:22px}
.compact-form>button{justify-self:start}
.horizontal-form{display:flex;align-items:end;gap:16px;flex-wrap:wrap;margin-top:18px}
.horizontal-form label{flex:1;min-width:180px}
.horizontal-form button{height:44px}
.details{display:grid;grid-template-columns:120px minmax(0,1fr);gap:11px;margin:20px 0;font-size:13px}
.details dt{color:var(--muted)}
.details dd{margin:0;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.section-heading{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.secret{display:block;background:var(--terminal);border:1px solid var(--border);border-radius:6px;padding:15px;font:12px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere;margin:15px 0;color:var(--accent-ink)}
#twofactor-enrollment,#recovery-panel{margin-top:24px;font-size:12px}
summary{cursor:pointer;color:var(--muted)}
.auth-shell{max-width:470px;margin:10vh auto 40px;padding:0 20px}
.auth-shell>.brand{justify-content:center;margin-bottom:38px}
.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:32px}
.auth-card h1{font-size:27px}
.auth-card>.muted{font-size:12px;margin-top:10px}
.auth-card form{display:grid;gap:19px;margin-top:28px}
.auth-card .primary{margin-top:5px}
.auth-foot{font-size:10px;color:var(--muted);text-align:center;border-top:1px solid var(--border);padding-top:22px;margin-top:25px}
.notification{position:fixed;top:18px;left:50%;transform:translateX(-50%);max-width:min(600px,90vw);z-index:100;background:var(--notice-bg);color:var(--notice-text);border:1px solid var(--notice-border);padding:12px 20px;border-radius:8px;box-shadow:0 10px 40px var(--shadow);font-size:13px;white-space:pre-wrap}
.notification.error{background:var(--error-bg);color:var(--error-text);border-color:var(--error-border)}
dialog{background:var(--surface);color:var(--text);border:1px solid var(--border-strong);border-radius:10px;padding:26px;max-width:calc(100vw - 30px);width:460px}
dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}
dialog h2{margin-bottom:12px}
dialog p{font-size:12px;margin-bottom:20px}
.dialog-footer{display:flex;justify-content:flex-end;align-items:center;gap:12px;padding-top:22px}
.dialog-footer>p{margin:0 auto 0 0;font-size:11px}
.editor-dialog{width:min(1100px,95vw);padding:0}
.editor-dialog .card-header h2{font:14px ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere;margin:0}
.editor-dialog textarea{display:block;resize:vertical;min-height:45vh;max-height:70vh;border:0;border-radius:0;background:var(--input);font:12px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;padding:22px;tab-size:4}
.editor-dialog .dialog-footer{padding:17px 22px}
.editor-dialog .eyebrow{margin-bottom:5px}
[hidden]{display:none!important}
@media(min-width:1600px){.content{padding-top:50px}
.summary-grid{margin-top:35px}
.terminal{min-height:400px}
}
@media(max-width:1050px){.app-shell{grid-template-columns:205px minmax(0,1fr)}
.sidebar{padding-left:12px;padding-right:12px}
.topbar{padding:0 25px}
.content{padding:30px 25px 20px}
.summary-grid{gap:10px}
.summary-card{padding:16px}
.summary-card>strong{font-size:18px}
.card-header{padding:18px}
.page-heading h1{font-size:25px}
.card-header{flex-wrap:wrap}
.actions{margin-left:auto}
.terminal{height:320px}
td,th{padding-left:18px;padding-right:18px}
}
@media(max-width:740px){.app-shell{display:block}
.sidebar{position:relative;min-height:0;height:auto;border-right:0;border-bottom:1px solid var(--border);padding:17px}
.sidebar>.brand{padding:0}
.instance-selector,.nav-label,.sidebar-footer{display:none}
nav{display:flex;overflow:auto;margin-top:18px;gap:4px}
.nav-item{font-size:11px;padding:9px 10px;flex:none}
.nav-item>span{display:none}
.nav-item.active{box-shadow:inset 0 -2px var(--accent)}
.topbar{height:50px;padding:0 18px;font-size:10px}
.private-label{font-size:10px}
.content{padding:25px 18px 20px}
.summary-grid{grid-template-columns:1fr 1fr}
.summary-card:last-child{grid-column:1/-1}
.summary-card{padding:14px}
.summary-card>p{margin-bottom:6px}
.summary-card>small{margin-top:3px}
.page-heading{margin-bottom:22px}
.page-heading h1{font-size:24px}
.page-heading .eyebrow{font-size:9px}
.page-heading .muted{font-size:12px}
.badge{font-size:10px;padding:4px 8px}
.card-header{padding:16px}
.card-header>.actions{margin-left:0}
.terminal{min-height:280px;height:45vh;padding:15px;font-size:11px}
.terminal-toolbar{padding:11px 15px}
.card-note{padding:11px 15px}
.command-line{padding:10px 13px}
.padded{padding:20px}
.auth-shell{margin-top:6vh}
.auth-card{padding:25px}
.editor-dialog .dialog-footer p{display:none}
.workspace-footer{font-size:9px}
.table-scroll td{padding:12px 14px}
.details{grid-template-columns:90px 1fr;font-size:12px}
}


.topbar-actions{display:flex;align-items:center;gap:12px}
.mobile-logout{display:none}
@media(max-width:740px){.mobile-logout{display:inline-flex;font-size:10px;padding:5px 8px}
.topbar-actions .private-label{display:none}
}


.error-text{color:var(--red)!important}
@media(max-width:740px){.editor-dialog .dialog-footer #editor-status{display:block;font-size:10px;max-width:55%}
}


@media(max-width:740px){.page-heading{align-items:flex-start;flex-direction:column;gap:13px}
nav{scrollbar-width:none}
nav::-webkit-scrollbar{display:none}
}


.icon { width:18px; height:18px; flex:none; display:inline-block; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.brand-gem { color:var(--accent); width:30px; height:30px; }
.theme-toggle { gap:7px; padding:7px 10px; font-size:11px; min-height:34px; }
.theme-toggle .icon { width:15px; height:15px; }
.auth-brand-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:30px; }
.auth-brand-row .brand { font-size:22px; }
.auth-foot p + p { margin-top:9px; }
.build-info { font:10px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }
.workspace-footer > div { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
.workspace-footer strong { color:var(--text-soft); font-weight:600; }
.game-icon { width:36px; height:36px; object-fit:contain; flex:none; border-radius:6px; }
.game-profile { display:flex; gap:10px; align-items:center; }
.game-profile strong { font-size:19px; font-weight:600; }
.private-label { align-items:center; }
.private-label .icon { width:13px; height:13px; }
.metrics-section { margin-bottom:24px; }
.metrics-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; }
.metrics-heading h2 { font-size:13px; }
.metrics-source { font-size:10px; color:var(--muted); }
.metrics-source.demo { color:var(--accent-ink); font-weight:650; }
.metrics-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.metric-card { border:1px solid var(--border); border-radius:9px; background:var(--surface); padding:17px 18px; min-width:0; }
.metric-label { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:11px; margin-bottom:12px; }
.metric-label .icon { width:15px; height:15px; }
.metric-card > strong { font-size:22px; font-weight:600; letter-spacing:-.6px; font-variant-numeric:tabular-nums; display:block; line-height:1.35; }
.metric-card > p { color:var(--text-soft); font-size:10px; margin-top:8px; min-height:15px; }
.metric-card > small { color:var(--muted); font-size:9px; display:block; margin-top:5px; }
.metrics-note { font-size:10px; color:var(--muted); margin:9px 2px 0; }
.demo-notice { border:1px solid var(--primary-border); background:var(--accent-soft); color:var(--accent-ink); padding:10px 14px; font-size:11px; margin:0 0 14px; border-radius:7px; }
.file-entry { display:flex; align-items:center; justify-content:flex-start; gap:10px; min-width:180px; }
.file-entry .icon { color:var(--muted); width:20px; height:20px; }
.file-entry.folder .icon { color:var(--accent-ink); }
.file-entry.config .icon { color:var(--green); }
.file-entry span { overflow-wrap:anywhere; }
button,.button,input,textarea,body,.sidebar,.card,.summary-card,.metric-card,.topbar,.terminal,.terminal-toolbar,.command-line,th,.auth-card,dialog { transition:background-color 180ms ease,border-color 180ms ease,color 180ms ease,box-shadow 180ms ease; }
.summary-card:hover,.metric-card:hover { border-color:var(--border-strong); }
.view:not([hidden]) { animation:view-enter 180ms ease-out; }
dialog[open] { animation:dialog-enter 150ms ease-out; }
dialog[open]::backdrop { animation:backdrop-enter 150ms ease-out; }
@keyframes view-enter { from { opacity:0; transform:translateY(5px); } to { opacity:1; transform:translateY(0); } }
@keyframes dialog-enter { from { opacity:0; transform:translateY(6px) scale(.99); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes backdrop-enter { from { opacity:0; } to { opacity:1; } }
@media(max-width:1050px) {
  .sidebar>.brand { font-size:15px; gap:7px; }
  .sidebar>.brand .brand-gem { width:24px; height:24px; }
  .metrics-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:740px) {
  .sidebar>.brand { font-size:19px; }
  .nav-item .icon { display:none; }
  .topbar { gap:10px; padding-left:14px; padding-right:14px; }
  .topbar > span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
  .topbar-actions { flex:none; gap:7px; }
  .theme-toggle { padding:5px 7px; font-size:10px; min-height:29px; }
  .topbar .theme-toggle [data-theme-label] { display:none; }
  .auth-brand-row .brand { font-size:20px; }
  .auth-brand-row { gap:10px; }
  .auth-brand-row .theme-toggle { gap:4px; }
  .metric-card { padding:14px; }
  .metric-card > strong { font-size:20px; }
  .metrics-grid { gap:10px; }
  .metrics-heading { flex-wrap:wrap; }
  .workspace-footer { align-items:flex-start; gap:10px; }
  .workspace-footer > div { display:grid; gap:3px; }
  .game-profile strong { font-size:16px; }
  .game-profile .game-icon { width:28px; height:28px; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

.server-domain { font-family:ui-monospace,SFMono-Regular,Consolas,monospace; overflow-wrap:anywhere; }
.selection-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 24px; border-bottom:1px solid var(--border); background:var(--surface-alt); }
.selection-toolbar > p { font-size:11px; color:var(--muted); }
.selection-toolbar .icon { width:15px; height:15px; }
.selection-cell { width:46px; padding-left:20px; padding-right:8px; }
.selection-cell input { display:block; margin:0; width:16px; height:16px; cursor:pointer; }
.selection-cell input:disabled { cursor:default; }
.selection-cell input:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.files-table tr.selected { background:var(--accent-soft); }
.files-table td:nth-child(2),.files-table th:nth-child(2) { padding-left:12px; }
.file-entry.archive .icon { color:var(--accent-ink); }
.file-size-label { display:block; font-size:10px; color:var(--muted); margin-top:2px; }
@media(max-width:740px) {
  .selection-toolbar { padding:12px 14px; flex-wrap:wrap; gap:9px; }
  .selection-toolbar .actions { margin-left:0; }
  .files-table .selection-cell { padding:12px 8px 12px 14px; }
  .files-table .file-entry { min-width:140px; }
}

.archive-limits-note { display:block; margin-top:5px; }

.upload-progress-panel { padding:16px 24px; background:var(--surface-alt); border-bottom:1px solid var(--border); }
.upload-progress-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:12px; }
.upload-progress-heading strong { font-size:12px; font-weight:550; overflow-wrap:anywhere; min-width:0; }
.upload-progress-heading button { padding:6px 10px; font-size:11px; flex:none; }
.upload-progress-panel progress { display:block; width:100%; height:7px; border:0; border-radius:6px; overflow:hidden; background:var(--border); accent-color:var(--accent); }
.upload-progress-panel progress::-webkit-progress-bar { background:var(--border); border-radius:6px; }
.upload-progress-panel progress::-webkit-progress-value { background:var(--accent); border-radius:6px; }
.upload-progress-panel progress::-moz-progress-bar { background:var(--accent); border-radius:6px; }
.upload-progress-panel p { color:var(--muted); font-size:11px; margin-top:10px; font-variant-numeric:tabular-nums; }
@media(max-width:740px) { .upload-progress-panel { padding:14px; } }